How to Use Ajax With Visual Web Developer Express

Written by lisa m. mcmahon
  • Share
  • Tweet
  • Share
  • Pin
  • Email
How to Use Ajax With Visual Web Developer Express
(Creatas Images/Creatas/Getty Images)

AJAX stands for Asynchronous JavaScript and XML. It is not a new programming language, but a way to exchange data with a web server and update parts of a web page without having to reload the whole page. AJAX became popular when Google implemented it for the Google Suggest search tool in 1995. Since then, many websites are using AJAX, including YouTube and Facebook.To use AJAX, W3Schools recommends that you have a basic understanding of HTML/XHTML, CSS and JavaScript.

Skill level:
Moderately Challenging

Things you need

  • Microsoft ASP.NET AJAX Control Toolkit

Show MoreHide


    Add AJAX Control Toolkit to Visual Web Developer Express

  1. 1

    Download the Microsoft AJAX Control Toolkit. Right-click the file and select "Properties." On the "General" tab, click "Unblock" and then "OK."

  2. 2

    Right-click the file and select "Extract" to uncompress the files to a folder on your PC, such as C:\ajax.

  3. 3

    Click "Start," "All Programs," "Microsoft Visual Studio 2010 Express" and "Microsoft Visual Web Developer 2010 Express." Click "New Web Site" on the "Start" page. Select your preferred programming language in the left pane and "ASP.NET Web Site" in the right pane.

  4. 4

    Select "File System" under "Location." Browse to the folder on your PC for the new website or enter a new website at the end of the suggested file location (e.g., C:\Users\yourname\Documents\Visual Studio 2010\WebSites\MyAjaxSite). Click "OK."

  5. 5

    Right-click within the toolbox and select "Add Tab." Enter "Ajax Control Toolkit" on the new tab.

  6. 6

    Right-click beneath "Ajax Control Toolkit" and select "Choose Items." Browse to C:\ajax or wherever you extracted the toolkit. Select "AjaxControlToolkit.dll" and click "Open." Click "OK."

    Adding an AJAX Control to a Web Form

  1. 1

    Right-click the top level under "Solution Explorer" and select "Add New Item." Select "Web Form," name the new Web page (e.g., AjaxCalendar.aspx) and click "Add."

  2. 2

    Drag the "ToolkitScriptManager" from the "Ajax Control Toolkit" in the toolbox onto the web form page. Drag a TextBox server control from the "Standard" tab onto the page. Edit the ID (e.g., "txtStartDate)" in source view or in the properties pane.

  3. 3

    Drag a "CalendarExtender" from the "Ajax Control Toolkit" to the page. Click the control then change "TargetControlID" In the Properties pane to match the ID of the TextBox server control.

  4. 4

    Save the page using "File" and then "Save." Press "Ctrl" and "F5" to preview and test the page using the built-in ASP.NET development server.

  5. 5

    Click in the text box and a calendar picker will display. Select a date and it will be entered into the text box.

Don't Miss

  • All types
  • Articles
  • Slideshows
  • Videos
  • Most relevant
  • Most popular
  • Most recent

No articles available

No slideshows available

No videos available

By using the site, you consent to the use of cookies. For more information, please see our Cookie policy.