ASP.NET, jQuery and Intellisense


Visual Studio and jQuery 

Microsoft has partnered with jQuery and because of that, Visual Studio will now include jQuery; if you have downloaded the latest version of ASP.NET MVC, you should find that jQuery was included although it is version 1.2.6 (the current version is 1.3.2). 

jQuery is a JavaScript framework that is comprehensive in its current form and constantly improving; the jQuery community has developed a number of terrific plug-ins that continually make the kit more attractive, valuable, and useful; it you have not tried it out, it is definitely worth looking into.  As far as the plug-ins go, the tablesorter and tablesorter pager really make the whole thing worthwhile if you are working with MVC at all; I think it is a far better solution than using the paged list option demonstrated in the latest "Nerd Dinner" application made available by Guthrie, Hanselman, Haack, et al., if for no other reason than it handles both paging and sorting rather than just sorting.  Other plug-ins also support filtering lists such that if you wanted to display a filtered, sorted, paged list, you can do that with jQuery in a few lines of code, or you can spend quite a bit more time trying to accomplish the same thing in the controller and model code in an MVC application. 

There is a lot to love about jQuery; the selectors alone will save a lot time in selecting single or categorized elements without fumbling around with the DOM.  To quote the blurb about the project found on their website, jQuery, "...is a new kind of JavaScript Library.  jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.  jQuery is designed to change the way that you write JavaScript".

If you have not looked it over, you owe it to yourself to take it for a test ride:  http://jquery.com/

1.gif

Figure 1:  ASP.NET Application Running with jQuery Tablesorter and Pager Plug-ins

Intellisense and jQuery

Scott Guthrie's wrote an entry on jQuery Intellisense; if you missed Scott Guthrie's original comments on it, you can see them here:

http://weblogs.asp.net/scottgu/archive/2008/11/21/jquery-intellisense-in-vs-2008.aspx

Per Scott Guthrie original entry, these steps are necessary to get intellisense going on with jQuery.  You can check out the original article or just follow the steps he outlined; they are as follows.

  1. Install the Support Patch that cues Visual Studio to look for JavaScript documentation files:  http://code.msdn.microsoft.com/KB958502/Release/ProjectReleases.aspx?ReleaseId=1736
  2. Download the latest version of jQuery and the associated documentation file:  http://docs.jquery.com/Downloading_jQuery#Download_jQuery
  3. When downloading the jQuery files, there are at least two to get, they are:
     
    1. Jquery-1.2.6.js (that is what MS distributes now, current version is 1.3.2; there is a minified version and an uncompressed version available)
    2. Jquery-1.2.6-vsdoc.js (follow the documentation link to get that)

Still Using 2005?

Forget it, intellisense won't work for you, it is dependent upon a patch applicable to VS2008 only.

Using jQuery with Intellisense

  1. Add jQuery files to web project (jQuery and the VS Doc file).
  2. As far as adding the script source tags to the pages, I've some recommendations that state you should add an entry for the VS Doc file while other indicated that it is not necessary.  I have been doing it without adding the script source reference for the VS doc file and have found that it works fine without it.

Fun with Master Pages

You can/should include the script source references in the master page; but if you do, you may not get intellisense on the content page.  There is something of a hack floating around that I will attribute to Rob King at Microsoft; it is mentioned here:

http://blogs.msdn.com/webdevtools/archive/2008/10/28/rich-intellisense-for-jquery.aspx.

By adding this work around to the content page, you can get jQuery intellisense on the content page.

The work around is to add this bit of code to the content page; it works and better yet, it does not seem to harm anything:

    <%if (false)

      { %>

        <script src="../../Scripts/jquery-1.2.6.js"

                type="text/javascript"></script>

    <%} %>

If you just add the script source, it of course blows up when you run it.

So, if I add this work around to the content page, do I get intellisense?  Yes, it works:

2.gif

Now, if I comment out the work around, do I still intellisense?  Well, I did not, not in an MVC application anyway.

Now, if it is not MVC and I include the script source references in the master page of a standard trash ASP.NET site and not on the content page, and if I don't use the work around, do I get intellisense?  Well, yes, I do.  So, in a nutshell, I needed the work around to get intellisense on an MVC view, but not on a normal ASP.NET site content page.

3.gif
So, if you have problems getting the jQuery intellisense to show up on a content page, use the work around, otherwise, press on.

Well, that is pretty much all there is to it.  I think jQuery is a useful tool for Visual Studio web development; I also think it is generally worth the effort to get the intellisense up and running to facilitate development with jQuery.  Oh, it should also be known that intellisense does not necessarily work with the jQuery plug-ins; that will likely get better but this form of intellisense is still all pretty new at the moment.

Up Next
    Ebook Download
    View all
    Learn
    View all