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/
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.
-
Install VS2008
SP1: http://www.microsoft.com/downloads/details.aspx?FamilyId=FBEE1648-7106-44A7-9649-6D9F6D58056E&displaylang=en
-
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
-
Download the
latest version of jQuery and the associated documentation file: http://docs.jquery.com/Downloading_jQuery#Download_jQuery
-
When downloading
the jQuery files, there are at least two to get, they are:
- 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)
-
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
- Add jQuery
files to web project (jQuery and the VS Doc file).
- 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:
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.
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.