Video: IntelliSense for Jscript and ASP.NET AJAX

This video provides an overview of the new Intellisense features for JavaScript in Visual Studio 2008 including core JavaScript methods, external .js files in .aspx pages, between external .js files, with core Microsoft libraries like MicrosoftAjax.js, client JavaScript behaviors, controls, and libraries, and web services. In addition, the integration of the new XML comments for JavaScript with Intellisense is demonstrated.

The following text is a software generated transcript of the video. Click on a minute link to jump to a location within the video


Minute 0

I have this dispels this video would it take a look at some of the exciting new JavaScript IntelliSense features in Visual Studio 2008 right get started let s create a new website project here and we ll just call this website TV and we already have a default is Jack Celeste at a JavaScript file here as well and will just call this JavaScript file it kills and everyone in a reference to that JavaScript file over here in our page splits do that whole at a script for the language is equal to JavaScript to type a sequel to tax JavaScript and the source is equal to or are you

Minute 1

Kills JS file now let s take a look at a the JavaScript IntelliSense features a person he wanted to do is give this to the element and ID and let s call this page content and then I went ahead a script block inside the page your slips to that language equals JavaScript can type text JavaScript and will create a little function near notice for getting IntelliSense for creating our JavaScript function clueless startup and then we ll define a couple local variables here notice for getting IntelliSense again for creation of our variable in the first one will call

Minute 2

His container and this comes from the document element in the dead element by ID is pretty nice for getting the IntelliSense help us create this page content and endlessly another local variable coal Index that has a value of zero and let s just create another one called this is some text which is has some text in it now only go to reference these variables in code what we ll see is the second future of JavaScript IntelliSense which is type inference could take the container local variable that we have here we go to one of the methods noticed that the IntelliSense engine has inferred that this is a guy

Minute 3

On document element and is giving us the appropriate properties and methods that go with the dawn element likewise if we were to use the index variable that we created here we re getting a variety of properties and methods that pertain to a numeric valuable and likewise if we used the text variable we re getting a bunch of methods and properties that pertain to text now you can go even a little bit further than this and let s say we take our index variable and since we re not strongly typed here in jobs that we can do this and we changed that to be some text down here and then we do to use that week at the textbased IntelliSense thread says penny though what it would have been

Minute 4

If we were to use index up here before we assigned a text to it and it is a quite an intelligent engineer so to speak because here is giving us the numeric methods and properties now let s go and add a method over in our utensils JS file here so I notice this is HS finally getting its same intelligence that we had over and default SPX to define our function and get a username and let s have this take a variable called ID and a pillow sample method here that would

Minute 5

And more complicated than that for this demonstration okay now let s flip back over to our default aspx page and go down here and let s say we want to create a local variable called name and we want to call that method over the JS file to automatically get IntelliSense on the methods and are JS file without having to do anything special including primer information that we need to pass to the method that recall so it s pretty neat if they want to take a look at the new XML comment capability has been added for JavaScript lets the back over here too are JS file that you probably use the XML commenting capability in the seashore or knowing in Visual Basic and there s a similar feature that s been at it for JavaScript has a few differences but it works pretty much in the same way for example we can add XML

Minute 6

These comments to our code here that ll be picked up by the IntelliSense engine facility can show them to us when we re using the method over in the SPX based on the sure how that works and one difference here is that the comments are pleased immediately inside of the function rather than above the function name which is what she would do in Visual Basic or seashore and the reason for this is that there is a two string method in JavaScript that allows the JavaScript engine here behind the scenes to pick up the contents of the method and then parse the XML comments so that we do it is at a triple comment counter the same issue would in seashore and then he used the similar XML elements for example we can type in a summary element here is

Minute 7

This insane method to did the person s name from an ID value close that off and we can add one for the parameter in the name of the parameter is ID and this is the person is ID value and we can also the head one for the return value and this is the persons name and we do need to save the JS file here before we get back over to default the SPX of the parser to pick up the information about

Minute 8

Over to default the SPX and must create a nether variable here will name to it let s you see get username and notice what getting the help here in the tool tip this is a method coming from Nice summary element that we at it and likewise here when we go to type deeply ID parameter were getting the information provided in the prime element that we can take this even one step further to show you some additional capabilities and smell comment documentation for tobacco or the JS file here all we can do is we can go over to the prime definition here and we came at a type attribute this case will make this a number and were also can indicate that the signature because JavaScript doesn t only has a number type it doesn t have an integer type takedown is yet another attribute

Minute 9

Which use integer equal to save this link now go back over to our default is the eczema said third local variable here to username with her IntelliSense and noted notice this time in addition to just the ideas the name of the parameter would getting an indicator that showing us that this is a number so will make this 150 fifth number of other attributes that you can edit your XML based comments to get rich IntelliSense and his nice blog posts here let me flip over to that by urchin LeRoy and a leave this will address up on the screen here for just a moment so you can copy it down and go look at it in a few view the video so he seem IntelliSense from an external JavaScript file TCAS

Minute 10

Ex page what about from one JavaScript file to another place for a second JavaScript file here in our website and this one lets call cordite JS and let s said a function in a year to call this function get flat law and will take him down and address and the let s return in this case which is an arbitrary number for your lead said some JavaScript comments to win a summary tag here for an address ago and

Minute 11

At a parameter in the name of it will be address type the full string this is the address to find the LAT law and Leslie will lead a return to say the LAT law of the address okay will save these changes to core JS here now let s go back over to our utensils JavaScript file but we need to do in order to have the Cross JavaScript IntelliSense screwup here beginning of the file symbol paste in a reference element to the cordite JS file so

Minute 12

Say that here as well now let s go down here and at a nether function to eat those who called us get a user LAT law have an inbound address to this and now we take GE wheat had the get LAT long method from the court got JS file so take that had noticed week getting the IntelliSense for the address parameter as well and it will pass in this address value here in a little close off the method and actually will do here is returned that like that so this demonstrates how we re getting IntelliSense from one JavaScript file to the other I guess just

Minute 13

Closed loop here when you go back over your core JS and the man at a reference element appear to pass equal to the pills diet JS and you ll save all our files you have root go down into this lat long function and use get to see we have our big username and get user Lab law form are you pills JS so this is shown us that we can get the Cross JavaScript IntelliSense what about referencing standard files like the Microsoft Ajax library while we can do that here as well and it s just a slight variation on the reference element that we use for you JS sweat

Minute 14

Other reference element and here instead of adding a path attribute we re going to add a name attribute and the name attribute is used for any JavaScript files that are dynamically added by this script manager in this case the Microsoft Ajax library suicide that name in gross soft hate Ajax JS close that off and say things here now if you go down here into our get let long function in the city wanted to use one of the methods the mics of Ajax library for example let s use the get shortcut here we have IntelliSense for the Microsoft Ajax library with all the corresponding methods that we have in there as well as you can see we re getting a parameter

Minute 15

And type information in here as well tailored to screen appears to concede that he made the standard use of the XML based comments for documentation and IntelliSense in your JavaScript files that are be very useful for your development teams in terms of sharing libraries and having access to this information that they did within a Visual Basic or see sharp methods as well in excess look at some features and IntelliSense related calling Web services from JavaScript reference to want to do is edit Web service to our website here so what add a new item at a Web service and will call this test Web service law at it and then as the standard hello world that s just changed it slightly here get message and will

Minute 16

Take an inbound argument as a string and will do is just concatenate this with a low Arielle and then the other thing we need to do is to add an attribute to indicate this is a script based service lets go up here and let s add a system Web script services script service attribute their wish y all said here we re now with our Web service say that let s switch back over to our default ASP asked page in the first we want to do is go down here in the form and we want to a script vendor to go IDE screw manager and a run in the goals

Minute 17

D rer here we go and we know what AAA is the service reference to the Web service which we just created and so add the services element and then within that web based service reference element in this case the path to our Web service is tested Web service slammer should be all set with that now if we go back up here to our script block at the top of the default ASP XP page and in this case we want to call a

Minute 18

And including all of the parameter information that we had it to do so will say Chris so that s an example of how you can get IntelliSense for Web services in your JavaScript which also should be a very useful tool Visual Studio OA has added some nice features related to a client libraries or behaviors for Microsoft Ajax extensions like you look it two aspects that one is the new templates for creating the items and the second is the nice integration with JavaScript IntelliSense close look at your website and add a new item noticed that there is a new templates for Ajax client behavior client control and client library in this case let s just create a client behavior JS file

Minute 19

Templates filled out a number of the major items that we need for treating our behavior including venturing the namespace as the default namespace the website up your website VB and it s also added a preference for IntelliSense for Microsoft Ajax library that we saw a few minutes ago let s save this client behavior JS here and now let s go over to our core JS file went in at another reference of Peter and this one when you specify the path to the client behavior JS file now we don t hear into our yet let long method if we take the view be gay IntelliSense for website VB the client behavior and then all of the methods that relate to the behavior sets an example of how

Minute 20

He had integrated behavior and an associate IntelliSense into our JavaScript file here court at JS and it would apply to creating a client library or a client control as well since a look at the new IntelliSense features for JavaScript and Visual Studio 2008 I know I m really excited to start using this because with the increased presence of Ajax functionality and websites and the corresponding increase in JavaScript these features will really be good for productivity encourage you to download the sample code take a look at it to your leisure this is Chris Bell s thank you for watching the video on IntelliSense features in JavaScript and Visual Studio 2008

Click here to go to original video page