How to... use Class Libraries with ASP.NET AJAX like AjaxPro

Tags: .NET, AJAX, Ajax.NET, ASP.NET, Atlas, HTML, JavaScript, Source Code, UI

Using Ajax.NET Professional (AjaxPro) you are able to put you AJAX methods wherever you want, if inside the Page class itself, any .NET class in the same project or as a reference class library. To generate the AJAX client-side JavaScript proxies the AjaxPro library checks for all public methods inside a specified type that are marked with the [AjaxMethod] attribute. The only thing you have to add to the Page class (in the Page_Load event) is the call to AjaxPro.Utility.RegisterTypeForAjax(typeof(ClassName)).WebApplication1 - Microsoft Visual Studio

ASP.NET AJAX is using a little bit different way, well, not very different. In the Page class you could add PageMethods. Those PageMethods will be automatically added to the client-side JavaScript proxies when there is a ScriptManager instance available and the EnablePageMethods property is set to true.

If you would like to build a class library in ASP.NET AJAX you have to write a WebService. "Oh, I don't know much about WebService and it is hard to develop those services!" No, that's not true! The only difference compared to AjaxPro is that you have to inherit from System.Web.Services.WebService and use the [WebMethod] attribute instead of the [AjaxMethod] attribute in AjaxPro. The class itself has to be marked with the [ScriptService] attribute.

Note: don't forget to add a reference to System.Web.Extensions and System.Web.Services.

 

Have a look at the same example as in my last post but using a Class library, now:

using System; using System.Web.Services; using System.Web.Script.Services; using System.ComponentModel; namespace ClassLibrary1 { //[WebService(Namespace = "http://tempuri.org/")] //[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] //[ToolboxItem(false)] [ScriptService] public class Class1 : WebService { [WebMethod] public int HelloWorld() { return 2; } } }

The public method didn't change, only a different attribute is used to mark this public method to be accessible from JavaScript later. The class itself has the [ScriptService] attribute as meta information. You need this because ASP.NET AJAX does not call a real web service. Instead it is using JSON and the XmlHttpRequest JavaScript object. To include the JavaScript proxy you have to include the ASMX file with an suffix /js:

http://localhost/WebService1.asmx/js

But where do you find the WebService1.asmx? It makes no sense to add a file called WebService1.asmx inside you Class library. What you have to do is to add a new ASMX file in you web application project. The easiest way is to add a new WebService file via Add new item or to simple add a new text file called WebService1.asmx.

Add New Item - WebApplication1

What you have to left inside the file WebService1.asmx is following content:

<%@ WebService Language="C#" Class="ClassLibrary1.Class1" %>

Don't forget that you can get rid of all the content in the code-behind source code file. You only need the WebSevice directive and the class name.

The ASP.NET engine knows now that you want to include the class ClassLibrary1.Class1 into this file. Every requests initiated to this file will be processed from your source code in the Class library. Compare this with the RegisterTypeForAjax call in Page_Load when using AjaxPro.

Now, on the client-side JavaScript code you can use nearly the same JavaScript as with AjaxPro. The only difference is the argument list for the AJAX method and the objects passed to the callback handlers. But comparing those methods to PageMethods you will see that they are built on namespaces where PageMethods are only constructed by the object PageMethods and the name of the method.

In our example the JavaScript we used in the last post is very similar. But first we have to include everything we need before. You may remember that ASP.NET AJAX is using a ScriptManager control that will include all the core scripts as well as a reference to the JavaScript client-side proxies. To add a WebService we have to add a ScriptReference.

<asp:ScriptManager ID="ScriptManager1" runat="server"> <Services> <asp:ServiceReference Path="~/WebService1.asmx" /> </Services> </asp:ScriptManager>

The Script reference points to the created WebService1.asmx which itself identifies that it will handle the Class1 in our ClassLibrary1 project. Now you are able to call the methods very similar to AjaxPro and the PageMethods. It looks like a combination of both libraries.

<script type="text/javascript"> function onSuccess(value, ctx, methodName) { alert(value + 5); } function onFailed(ex, ctx, methodName) { alert("Failed."); } window.onload = function() { var ctx = null; ClassLibrary1.Class1.HelloWorld(onSuccess, onFailed, ctx); } </script>

Wow, this was very easy!! And when you know the only difference is in the parameter list for both the AJAX method and the callback handlers you are fine to move to ASP.NET AJAX. Any further questions?

5 Comments

  • Molson Ice said

    Thanks for article and how to utilize the asmx file to point to the class library. That is a descent work around but not as nice as the AjaxPro's way. Having to add the asmx file is an extra step that isn't needed with AjaxPro. What I like about the AjaxPro way is I just need to add a reference to a class library, drop a custom control from that class library onto my page which has embedded javascript that calls methods in the custom control. No need to add an asmx file, it's very simple and clean. I just don't like having to add an asmx file, I wish there was a way to do this in code. Thanks again for your article and the excellent AjaxPro.

  • xsirxx said

    That is a nice write up thank you for taking the time. I wanted to make sure to add the note that a WebService cannot be inherited from a WebControl. This is my understanding. What would you consider the best way to use a WebService for an actual custom web control? Thanks again!

  • xsirxx said

    Last post didnt come up but I hope it will sometime soon. Here is another question, how do you access custom members of the WebService class. For instance I created a new WebService and now I cant seem to be able to access any of its members in the web page's cs code file... like so, webservice.controlreference = ... Thanks again!

  • jasonxz said

    Michael, please, there's got to be a way of embedding ASP.NET AJAX calls in to a custom web control. If not, the ASP.NET AJAX library is taking a huge leap backwards from AjaxPro (especially when you include the fact that it doesn't allow for synchronous calls which is ridiculous).

Comments have been disabled for this content.