Using jQuery for AJAX in ASP.NET

Introduction

Have an ASP.NET 1.1 site that you want to quickly add some AJAX functionality to? Could you use the new Microsoft AJAX release? Of course, but you could also use any of the popular JavaScript libraries available and do it yourself just as easily. In some cases, you may not want to use the new Microsoft AJAX. Luckily, there are plenty of other good (and easy) alternatives! This article will demonstrate how to use a popular JavaScript library (jQuery) to add AJAX capabilities to your application with a minimal amount of code.

Background

So, why wouldn't you upgrade to ASP.NET 2.0 and just use the new AJAX functionality provided by Microsoft? Well, if your site is deployed and working – you may not want (or be able to) upgrade to ASP.NET 2.0 as quickly as you would like to. You could, of course, use the new Microsoft AJAX functionality in your ASP.NET 1.1 application (as noted in this article), but just in case you don't want to – this article offers another alternative. Most of the popular JavaScript libraries available today have AJAX functionality built right in, and it's usually a snap to use. Some of the most popular JavaScript libraries are Prototype, Yahoo User Interface Library (YUI), and jQuery. jQuery happens to be my personal favorite, so that's what this sample will use. I could wax poetic on why I like it so much, but as that isn't the point of this article, I'll let you decide for yourself. Whichever one you choose, the process outlined in this article shouldn't vary all that much. With all of that out of the way, let's get started.

This sample will utilize a popular JavaScript library called jQuery to provide almost everything we need to utilize AJAX in this sample. If you are unfamiliar with jQuery, it is an extremely lightweight JavaScript library that has changed the way that I write JavaScript. It's made the process a lot more enjoyable as well.

Using the code

The attached demo project includes both samples described here. To use it, unzip it to a directory on your system, and then create a Virtual Directory in IIS called "AJAXJQuerySample", and point it to the folder that contains the unzipped files. Next, just open the AJAXJQuerySample.csproj file!

Pre-requisites

First, you'll need to download the latest version of the jQuery JavaScript library from here (version 1.1 at the time of this writing). While you're doing this, you might want to bookmark the jQuery site for a quick browsing later on. One of the reasons that this is my library of choice is because of the extremely active user base. The forums are very active, and questions are usually answered very quickly. There are also tons of "plug-ins" that other users have made for jQuery that do just about anything you can think of.

Sample 1: Get the current date and time from the server

For this first example, we'll be creating a simple page that grabs the current time from the server. To begin, we'll need to include the jQuery file in our "Default.aspx" page, like so:

See full detail: http://www.codeproject.com/KB/ajax/AjaxJQuerySample.aspx

Comments

Post a Comment

Popular posts from this blog

Asynchronous Socket Programming in C#

Image
Objective The objective of this article is to demonstrate a socket-based client/server application that will allow two-way asynchronous communication between a server and multiple client applications. Because this example uses asynchronous methods, the server application does not use threads to communicate to multiple clients (although internally the asynchronous communication mechanism uses threads at the OS level). The Difference Between Synchronous and Asynchronous Communication in Network Programming The key difference between synchronous and asynchronous communication can be explained with an example. Consider a server application that is listening on a specific port to get data from clients. In synchronous receiving, while the server is waiting to receive data from a client, if the stream is empty the main thread will block until the request for data is satisfied. Hence, the server cannot do anything else until it receives data from the client. If another clien
Read more

Url Routing MVC TUTORIAL

Image
This tutorial covers an introduction to the MVC pattern using Visual Basic. It also includes a brief overview of the URL routing assumptions that are a foundation to the implementation of the pattern. A sample application is created to demonstrate the fundamentals of this new web-application model. Implementing business rules and testing is also covered. Finally, the use of two alternative view engines, Silverlight and XML Literals, is coverd.
Read more

WCF Chat Sample

Image
The Chat sample demonstrates how to implement a multiparty chat application by using PeerChannel. Messages sent by any instance of a chat application are received by all other instances. To get samples and instructions for installing them Do one or more of the following: On the Help menu, click Samples . The Readme displays information about samples. Visit the Visual Studio 2008 Samples Web site. The most recent versions of samples are available there. Locate samples on the computer on which Visual Studio is installed. By default, samples and a Readme file are installed in drive :\Program Files\Microsoft Visual Studio 9.0\Samples\ lcid . For Express editions of Visual Studio, all samples are located online. For more information, see Locating Sample Files . Security Note: This sample code is intended to illustrate a concept, and it shows only the code that is relevant to that concept. It may not meet the security requirements for a specific environment, a
Read more