Click here to Skip to main content
Click here to Skip to main content

Tagged as

Go to top

Friday Tip 06, We love Visual Studio Intellisense. Let's love it more.

, 19 May 2009
Rate this:
Please Sign up or sign in to vote.
I’ll be discussing a special area of VS intellisense that VS 2008 brought to further make developers happier. That would be JavaScript intellisense along with the latest additions to the intellisense package which is Jquery Intellisense.

We, developers, love nothing in Visual Studio more than its intellisense. Right ?? Yes of course, I guess that’s my readers answer if they have been using Visual Studio for sometime.

Why not, since it’s getting smarter, no let's say more intelligent with every release of Microsoft Visual Studio.

Today I’ll be discussing a special area of VS intellisense that VS 2008 brought to further make developers happier. That would be JavaScript intellisense along with the latest additions to the intellisense package which is Jquery Intellisense.
There is more.

First: Javascript Intellisense

Scripting JavaScript before VS 2008 and after in VS is totally different. You simply get the power of scripting with the joy of intellisense rather than trying to remember what a particular method name is or even having your favorite search engine warmed up with JavaScript names searches.

Either you script within your page or in a separate file you will get the intellisense like below:

What about your own JavaScript ?? For sure, you need intellisense for JavaScript you wrote in a separate JavaScript file to be seen from pages or even other JavaScript files. You got that too. In below screens, I have a JavaScript file “main.js” that has a function called ShowLove(). You can see in the second screen that I can see it from my aspx page and all I needed is to add a reference to the js file like we all used to:

I know you are smart enough and had noticed the help tip “Show love alert”. If you went back to the method declaration, you will notice the documentation line in the beginning of the method body. Reminds you of something?? Didn’t I tell you that you are smart, that’s right the XML documentation in our .NET code and of course it has the same functionality of providing help to who is consuming your methods. But remember, in .NET, we write our XML comments before method or class declaration whereas in JavaScript we write them at the beginning of methods. In the references at the end of the article, you will find a great article about JavaScript intellisense comments to get more about them.

Now, what about calling JavaScript written in JavaScript file from another JavaScript file? To do this, you will need to reference your source JavaScript file at the beginning of your destination file “where you want to call that JavaScript” and the syntax is simple as below:

If you are not installing VS 2008 SP1 the above example won’t work for you until you install this HotFix. I will recommend you to install the SP1 which we will need for the other part of this article Jquery Intellisense.

The fun doesn’t stop here, Actually the fun will just start with the second part of this article “just below”, so let's have fun …

Second: Jquery Intellisense

If you have been a web developer for a while, for sure you have come across Jquery and moreover you may have become a fan like most of us. Since I assume you already know what Jquery is, let's not talk about it and get to our point. After all we all know how light, delight, effective, easy, powerful and time saving JavaScript utility is Jquery. Microsoft knew it as well and that’s why they decided to add Jquery Intellisense for Visual Studio with collaboration of Jquery team.

To use this great addition to Intellisense, you will need the following :

  1. Download and install VS 2008 SP1
  2. Download and install this patch to support vsdococ.js files.
  3. Download Jquery and Jquery-vsdoc.js files

After you finished, add Jquery file along with the vsdoc file in the same directory.

Make a reference to your jquery in your page or JavaScript file and have fun getting Jquery intellisense in your Visual Studio:

Some Tips

While enjoying JavaScript and jquery intellisense in Visual Studio, I came across few tips that I’ll share with you. They can simply save you some time in one busy day when tiny little things become invisible.

  1. When using Master Page that is not in the same directory as its content page and you want to write JavaScript inside that page, you will need to change your JavaScript/jaquery reference to represent how master page sees your JavaScript/jquery at development time which is opposed to run time. Consider the below file structure:

    To be able to use intellisense from that master page, your JavaScript reference will be like below:

    However for your JavaScript to run in the browser, you will need to update your JavaScript reference since master pages are not actually pages and rendered as part of their content pages.

  2. Make sure that the vsdoc file has exactly the same name as the jquery file plus -vsdoc.js. I say that because the latest version of jsdoc to download from jquery site ends with vsdoc2.js which you need to convert to jsdoc.js to work. Moreover to use the minified version of jquery, you will need to remove min part from the name.
  3. Sometimes, the intellisense doesn’t work immediately so you may need to give a carriage return to start writing on a new line so that Visual Studio can bring you intellisense. So whenever you get this situation, you may close and reopen your page or js file and start writing on a new line. I don’t have a logical explanation for this situation but I have come across it several times and that’s how it worked out with me.

Below are some reference articles that provide more explanation and that you will find are great:

This post is on


License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Bassem Fawzy
Web Developer TayaIt
Egypt Egypt
Senior Developer / Project Manager.
http://www.bassemfawzy.com

Comments and Discussions

 
Generalthank you Pinmemberhungud14-Oct-10 17:23 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web03 | 2.8.140916.1 | Last Updated 19 May 2009
Article Copyright 2009 by Bassem Fawzy
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid