Invoke ASP.NET Web Service from JavaScript Without Creating Code Behind Proxy

• Download source - 22.39 KB

Introduction 

Traditionally when we consume a web service, we create a proxy by adding a web reference through Visual Studio. This proxy class contains web service exposed methods and these methods can be invoked from code behind. This works fine if web service path does not change.

Secondly if new functionality is exposed from the web service, we need to update the web reference and proxy will be updated accordingly.

At some places where we need to populate data dynamically based on Database driven configurations like integrating various systems in ERP applications, if we do code changes in highly configurable environments, the overall efforts would be higher than if we do static code change and the further cost of customization would be unexpected high. 

We can call an Ajax web service easily by using Sys.Net.WebServiceProxy to invoke the Web service from JavaScript. We just need to add Script Manager in the Page. 

Background

Some time ago, one of my friends was developing an ERP kind of product where he was populating data based on database entries, like if type of the datasource is SP, Table, view or Web service; he was fetching the data from the database(s) but calling the Web service. He had to depend upon static proxy class created at the time of development.

During the customization of the product, he could change only DB entries, aspx and JavaScript(s).

Using the Code

I have created one Ajax web service project and one Web project in Visual Studio 2008.

The web service returns the current server time and makes it Ajax enabled by putting [System.Web.Script.Services.ScriptService] attribute at the class level.

I call this web service from different projects, having one simple form.

On button click, I invoke a web service by using Sys.Net.WebServiceProxy class provided by Ajax.

 var webServicePath='http://localhost/TimeWebService/TimeService.asmx';
        var webMethod='GetServerTime';
        Sys.Net.WebServiceProxy.invoke(webServicePath, 
            webMethod, false,{}, OnSucceeded, 
            OnFailed,"User Context",1000000);	

function OnSucceeded(result, eventArgs)
        {   
            var RsltElem = document.getElementById("lblTime");
            RsltElem.innerHTML = result;
        }		

I have developed the sample in C# and uploaded the sample in zip format.