Key Features of jQuery
- Support for Browser independence: jQuery is supported by most of the modern day browsers.
- Support for a simplified Event Handling model: jQuery provides support for an excellent, easy to use normalized event handling model with much reduced code. The jQuery Event Handling model is consistent across all browsers. The even object is a cross browser normalized one and one event object is always passed as a parameter to an event handler.
- Support for Seamless extensibility: jQuery provides support for extensibility through an easy to use plug-in API that enables extending the jQuery core library seamlessly.
Pre-requisites
To get started with jQuery you should have the following installed in your system:
- Visual Studio 2008
- Visual Studio 2008 SP1
- jQuery Library
- Visual Studio 2008 jQuery Plug-in
Downloading jQuery
You can download the jQuery library from this link: http://jquery.com/
As of this writing, the current version of jQuery is 1.3.2
Getting started with jQuery
In this section, we will explore how we can get started with jQuery in ASP.NET in a step-by-step manner.
Note: To get a feel of jQuery intellisense in Visual Studio 2008, you should install the HotFix: KB958502 that comes free from Microsoft. You should also download the jQuery Intellisense file and place it side by side along with the jQuery library in your Visual Studio solution, i.e., place it in the same path.
To get started with your first sample application in ASP.NET that uses jQuery, follow these steps:
1. Open Visual Studio and click on File-> New->Project.
2. Select .NET Framework 3.5 as the version and the ASP.NET Web Application template from the list of templates displayed.
3. Specify a name for the project and click OK to save.
4. Create a new folder in the solution explorer and name it as Scripts.
5. Right-click on this folder and select Add Existing Item.
6. Now, browse to the path where you have downloaded the jQuery library and the jQuery intellisense documentation.
7. Select the two files and click on Add to add the files in the Scripts folder.
8. Next, drag and drop the jquery-1.2.6.js file from the Solution Explorer on to the Head section of the Default.aspx file to create a reference as shown below:
1 "server"> 2 Getting Started 3 4
9. Now add the following script to your web page:
| 1 | |
| 2 | $(document).ready(function() |
| 3 | { |
| 4 | alert("Using jQuery in ASP.NET"); |
| 5 | }); |
| 6 |
The Complete Example
Here is the complete code for your reference:
1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="_Default" %> 2 > 3 <html xmlns="http://www.w3.org/1999/xhtml" > 4 <head runat="server"> 5 <script src="Scripts/jquery-1.2.6.js" type="text/javascript">script> 6 <title>Getting Startedtitle> 7 <script type="text/javascript"> 8 $(document).ready(function() 9 { 10 alert("Using jQuery in ASP.NET"); 11 }); 12 script> 13 head> 14 <body> 15 <form id="form1" runat="server"> 16 form> 17 body> 18 html>
| 1 | <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="_Default" %> |
| 2 | > |
| 3 | <html xmlns="http://www.w3.org/1999/xhtml" > |
| 4 | <head runat="server"> |
| 5 | <script src="Scripts/jquery-1.2.6.js" type="text/javascript">script> |
| 6 | <title>Getting Startedtitle> |
| 7 | <script type="text/javascript"> |
| 8 | $(document).ready(function() |
| 9 | { |
| 10 | alert("Using jQuery in ASP.NET"); |
| 11 | }); |
| 12 | script> |
| 13 | head> |
| 14 | <body> |
| 15 | <form id="form1" runat="server"> |
| 16 | form> |
| 17 | body> |
| 18 | html> |
Summary
jQuery is a simple, light-weight and fast JavaScript library that has simplified the way you write your scripts these days. It is all set to become the framework of choice for building fast and responsive web applications in the years to come.For additional information on jQuery :
No comments:
Post a Comment