Programming Ajax code in VB.NET

Ajax in VB.NET without Visual Studio!

A couple of weeks back I wanted to try doing a bit of Ajax. ASP.NET (using VB) is my language of choice, which I thought would be widely supported. Not quite. Microsoft have a new Ajax library, which I haven't checked out yet, so I decided to try out Jason Diamon's Ajax.NET. Once I'd got it to work it was brilliant. Here's what I did!

Setting up Ajax.NET

Download Ajax.NET from Jason Diamon's site. Unzip it until a dir, let's say c:\temp.

You'll then need to compile it. Try going into your directory:

C:\WINDOWS\Microsoft.NET\Framework\

and do a dir. On my machine I have the following directories:


05/12/2005 12:56 PM <DIR> v1.0.3705
06/03/2006 11:04 PM <DIR> v1.1.4322
05/12/2005 12:00 PM <DIR> v2.0.50727

which means that I have version 1.0, 1.1 and 2.0 of the framework. For this article I'll be using 1.1, just because that's what I'm most comfortable with.

So what I did was add that directory to my path:


set PATH=%path%;C:\WINDOWS\Microsoft.NET\Framework\v1.1.4322

You should now be able to type:


cd \temp
csc

Which is the C#.NET compiler, and you'll get an output like:


C:\TEMP>csc
Microsoft (R) Visual C# .NET Compiler version 7.10.3052.4
for Microsoft (R) .NET Framework version 1.1.4322
Copyright (C) Microsoft Corporation 2001-2002. All rights reserved.

fatal error CS2008: No inputs specified

Is that really a "fatal" error? Geez talk about overstatement. Anyway.
So what you need to do is to compile the .cs files into a DLL:


C:\TEMP>cd ajax\ajax

C:\TEMP\Ajax\Ajax>csc /target:library /out:Ajax.dll *.cs
Microsoft (R) Visual C# .NET Compiler version 7.10.3052.4
for Microsoft (R) .NET Framework version 1.1.4322
Copyright (C) Microsoft Corporation 2001-2002. All rights reserved.


C:\TEMP\Ajax\Ajax>

Thanks for the verbose output Microsoft. Was it really that difficult to add a "printf ("Ajax.dll compiled ok");" ? Anyway, you'll notice that you now have a file named Ajax.dll. What we want to do is copy this file into our web applications /bin folder. If you don't have one (and I didn't), just create it:


C:\TEMP\Ajax\Ajax>mkdir c:\inetpub\wwwroot\webapp\bin

C:\TEMP\Ajax\Ajax>copy Ajax.dll c:\inetpub\wwwroot\webapp\bin

Creating the Web application!

Setup a test page that has the following HTML:


<%@ Page Language="VB" Debug="true" %>
<%@ Register TagPrefix="ajax" Namespace="Ajax" Assembly="Ajax" %>

<script runat="server">
sub Page_Load()
Ajax.Manager.Register(me)
end sub
<Ajax.Method> function getDetails(staffID as string)
dim strStaffName as string = "not found!"
select staffID
case "1": strStaffName = "Neo Anderson"
case "2": strStaffName = "Sean Michaud"
case "3": strStaffName = "Some other idiot name"
end select
getDetails = "Corresponds to: " + strStaffName
end function
</script>


<script language="javascript">
function go()
{
var result = ASP.test_aspx.getDetails(document.getElementById('inputID').value);
if (result.error) {
document.getElementById('somedata').innerHTML = "error fetching data";
} else {
document.getElementById('somedata').innerHTML = result.value;
}
}
</script>

<html>
<head>
<title>Test Ajax code</title>
</head>
<body>
<form runat="Server">
Please enter an ID from 1-3:
<asp:textbox id="inputID" runat="server" maxlength="8" onKeyUp="go()"/> <br />
<div id="somedata"></div>

</form>
</body>
</html>

That'll do for an example. So what's going on here?

Well, the first blue block of code involves doing an initialization
call to the library. The "getDetails()" function is a typical bit of code that would normally connect up to a database. Now the cool
thing with ajax.net is that all you have to do is put in the annotation of :



And the clever library generates a Javascript wrapper so that you can call your code from the client side! Genius!

The green javascript code does nothing special. Upon changing the textbox, it sends off a call to our getDetails() function, and displays the result below. Brilliant. There's a huge number of applications for this sort of thing, but my favourite is definitely for data lookup. Typing in someone's name could bring up a list of similar names, or even duplicate names. Have fun!