jQuery and Visual Studio

jQuery and Visual Studio

Microsoft has announced that it’s going to make jQuery part of the Visual Studio and use it within ASP.Net AJAX framework and ASP.Net MVC framework. Not only that, Microsoft will also provide a free download for VS 2008 SP1 which would provide intellisense to jQuery within visual studio. For more info on this annoucement refer to the links below

 The best bit is that Microsoft is going to provide jQuery unchanged as it is. This means that even if Microsoft changes any of the code, it would submit a patch to jQuery like anyone else.

jQuery

For the ones new to jQuery, jQuery is a lightweight open source Javascript library similar to Prototype and YUI. It allows you to easily find and manipulate HTML elements with minimum lines of code. jQuery uses an interesting concept “Chainability” to make its code short and simple. jQuery has the following features,

  1. DOM element selections
  2. DOM traversal and modification
  3. Events
  4. CSS manipulation
  5. Effects and animations
  6. Ajax
  7. Extensibility
  8. Utilities – such as browser version and the each function
  9. JavaScript Plugins – Tablesorter

jQuery Basics

Once we include the jQuery js file(downloaded from jQuery) as below, we could start using the funtions within jQuery.

<script type=“text/javascript” src=“jQuery.js”></script>
 
Adding an event is as simple as this,


  1. $(“a”).click(function(event){
  2.    alert(“Hello World!”);
  3.  });
 
 $(“a”) selects all the anchor(a) elements on the page and binds the click event to them. The same could be rewritten so that an element could be selected instead of all. This is similar to document.getElementById


  1. $(“#btnHello”).click(function(event){
  2.    alert(“Hello World!”);
  3.  });
Lets consider this example,
 
$(“#divMessage”).show().html(“Hello!”);
 
The above line of code makes the div visible and sets the HTML content to “Hello!”. Here we use the concept of chainability to make the code short & simple. This is easily achieved because every method within jQuery returns an object.
 
This example shows code to hightlight alternate rows in a table,
 
$(“#tblProducts tr:nth-child(even)”).addClass(“alternateRow”);
 
We could even do animations easily using jQuery. More on this and to sort tables using jQuery plugin – Tablesorter will be discussed in the coming days.
 
Ponnu
 
 
 
 
 

1 Comment

[...] have been using jQuery extensively these days since Microsoft announced the support

Leave a comment

Your comment

Spam Protection by WP-SpamFree