ASP.NET Ajax Controls and jQuery IntelliSense - UPDATE

by ASP.NET AJAX Team | Comments 11

Starting from the Q3 '08 release, the jQuery library is an integral part of RadControls for ASP.NET AJAX. We've posted instructions on how to use the included version in your code and how to enable IntelliSense.

The bad news is that the instructions for enabling IntelliSense no longer work with the Q1 '09 version. The reason is that Visual Studio 2008 has a problem with parsing the jQuery library from version 1.3 and up. This required us to come up with a new way to enable IntelliSense. The good news is that the new approach is much cleaner and doesn't require external files at all.

To include jQuery on your page and enable IntelliSense you need to grab the latest internal build (version 2009.1.331 and up) and add these script references:

<asp:ScriptManager runat="server" ID="ScriptManager1">
    <Scripts>
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
        <!-- 
            jQueryInclude.js will replace jQuery (the global $ variable)
            with the version embedded in Telerik RadControls!
        -->
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
    </Scripts>
</asp:ScriptManager>

What we did was to add the Visual Studio documentation (jQuery-vsdoc.js) in the assembly. Visual Studio now happily ignores the original script file and uses the -vsdoc version to generate the IntelliSense hints. This means less work for you too, as there's no need to download the help file separately.

Note: IntelliSense will not work if RadScriptManager is used instead of ScriptManager. For all intents and purposes, the reference to the later seems to be hard coded in Visual Studio. We'll let you know if we find a workaround, but for the moment you'll have to use ScriptManager while writing your JavaScript code and replace it with RadScriptManager later on.

UPDATE: You'll need this hotfix for IntelliSense to work: KB958502-JScript Editor support for “-vsdoc.js” IntelliSense documentation files.

About the author

Iana Tsolova

Iana Tsolova

is Program Manager of Telerik’s ASP.NET AJAX division. She joined the company back in the beginning of 2008 as a Support Officer and has since occupied various positions at Telerik, including Senior Support Officer, Team Lead at one of the ASP.NET AJAX teams and Technical Support Director. Iana’s main interests are web development, reading articles related to geography, wild nature and latest renewable energy technologies.

11 Comments

Christopher Blickley

This is great!  I think this really solves the last issue and gets us completely up and running with jQuery from the Telerik DLL.

The only other thing I did was to add another .js file to my project with the following in it, then add it to the ScriptManager. 

    window.$ = $telerik.$;

FInally, to get Intellisense in external .js files, I also add this to the top of the .js file.  It get's intellisense running for the Microsoft AJAX library as well as the jQuery library from the Telerik DLL:

1 /// <reference name="MicrosoftAjax.js"/>  
2 /// <reference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />   
3 /// <reference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />   
4 /// <reference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> 

-Chris
Robert
If you are doing this on sahrepoint the reference may need to be altered a bit:

<asp:ScriptManager runat="server" ID="ScriptManager1"> 
    <scripts> 
        <asp:ScriptReference Assembly="Telerik.Web.UI, Version=2009.1.402.20, Culture=neutral, PublicKeyToken=121fae78165ba3d4" Name="Telerik.Web.UI.Common.Core.js" />  
        <asp:ScriptReference Assembly="Telerik.Web.UI, Version=2009.1.402.20, Culture=neutral, PublicKeyToken=121fae78165ba3d4" Name="Telerik.Web.UI.Common.jQuery.js" />  
        <asp:ScriptReference Assembly="Telerik.Web.UI, Version=2009.1.402.20, Culture=neutral, PublicKeyToken=121fae78165ba3d4" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> 
    </scripts>  
 </asp:ScriptManager> 
 

This worked for me.
Tsvetomir Tsonev
@Christopher - You shouldn't need an external file to assign jQuery to the $ global variable. In fact, this is what jQueryInclude.js does.

@Robert - You're right - you'll need the fully qualified name when the assembly is deployed in the GAC. The short name is still preferred for bin deployment, as you don't need to update it when upgrading the assembly.
DC
This is great but how about intellisense for RadControls themselves?  The client side API for the controls are awesome but in order for you to use them you have to search/read blogs and help docs etc...  Lots of time is wasted on this from me.  Thoughts?
Martillo
I'll have to agee with DC on the need for Intellisense for the RadControls clientside scripting, although this blog may not be the appropriate place to lobby for this feature.

As for the inclusion of the jQuery-vsdoc.js file in the assembly, hopefully this doesn't mean that this file is getting downloaded to the user's browser... the minified version of that file is about 190KB. Tell me it ain't so...
Christopher Blickley
If you examine the embedded resources in the .dll, there is a Telerik.Web.UI.Common.jQuery-vsdoc.js file, so it would seem that VS.NET is smart enough to look for the "-vsdoc.js" files in assemblies just like it would if the files were text files in the file system.

I also examined the jQueryInclude.js file in the assembly and it does appear the only thing this does is map window.$ to $telerik.$.

Again, this is really cool and is working great.  I would be nice to have the client-side RadControls javascript with Intellisense. 

-Chris
Tsvetomir Tsonev
Actually this is what we were thinking when we came up with this solution. Using embedded -vsdoc files are the way to go with our client-side API documentation. We still have a lot of work to make it happen though, but we're definitely putting this on our to-do list.

@Martillo - The -vsdoc file will not get downloaded by the browser. Only Visual Studio cares about it and none of the controls actually reference it.

Martillo
Thanks for your reply to my question, Tsvetomir.

Also, Is there any way to easily determine which version of JQuery is included in the currently running build of RadControls for ASP.Net AJAX?

Tsvetomir Tsonev
Not sure if this is officially supported, but the jQuery version can be read from its prototype: $.prototype.jquery or $.fn.jquery for short.

We closely follow the official jQuery releases, so it's almost guaranteed that each official release will have the latest jQuery bundled in.

David North
I just switched from inclusion of the jquery-1.3.2.js script to use of the included jquery in ASP.NET AJAX Controls.  I don't have any problem with my use of jquery at runtime, but I don't get intellisense support.

This is in the <body> of my master page-
    <asp:ScriptManager ID="ScriptManager1" runat="server">
        <Scripts>
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        </Scripts>
    </asp:ScriptManager>

I see the following warning in the Error List:
Error updating JScript IntelliSense: Telerik.Web.UI.Common.jQuery.js:Telerik.Web.UI: Object doesn't support this property or method @ 18:9345

Any help would be appreciated.
Stefan
You can review the latest support resources concerning jQuery and RadControls for ASP.NET AJAX JavaScript IntelliSense, David:

http://www.telerik.com/help/aspnet-ajax/jquery-intellisense.html

http://blogs.telerik.com/stefanrahnev/posts/10-03-01/radcontrols_for_asp_net_ajax_q1_2010_release_comes_with_native_net_4_builds_and_javascript_intellisense_in_vs_2008_2010.aspx

Comments

  1.    
     
    		 
    		  
       
  3. (optional, emails won't be shown on public pages)
  4. (optional)
Read more articles by ASP.NET AJAX Team - or - read latest articles in Developer Tools
Bloggers Archive Tags