Thursday, December 15, 2011

ASMX service in MVC 3 Razor

We at Anthem Infotech pvt. ltd. recently came across an issue with using ASP.net asmx service with ASP.net MVC 3 Razor project, so we set out on a quest to resolve the issue with a number of options in mind 


  1. Using Javascript to call and handle the service calls
  2. consuming the service by simply adding a web reference in the page controllers (naah too easy)
so we decided to go the Javascript way as it best suited our needs and was a challenge for us in technical terms.

before moving to describing the solution, here are the 2 urls which where very helpful in working out a solution



Step 1 is a copy of step 3 from dotnet by example blog, to enable the service to be callable from javascript you need to add the [ScriptService] tag on the top of the web service class.

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ToolboxItem(false)]
[ScriptService]
public class DemoService : System.Web.Services.WebService
{
 [WebMethod]
 public string HelloWorld( string ToSomeone )
 {
   return "Hello World" + ToSomeone;
 }
}

Step 2: Is adding web reference of the service as we normally do in any case


Step 3:


add 2 script tags like below
 src="@Url.Content("~/Scripts/MicrosoftAjax.js")"


 src="@Url.Content("service.asmx/js")"


first tag refers to the microsoftajax.js already present in the script folder of the MVC 3 project and second tag refers to the service asmx page with a trailing "/js" tag this gives the scripted version of service which can then be directly called in javascript methods.


function Regscan() {
 var   ip = hdIP.value; // hdIP is a hidden variable that has the IP value

 demoproject.service.Registeruser(ip, RegscanCallback); 
 // Service call with call back method that is pass the result.

      }

 function RegscanCallback(result) {
          var id = result;
          somemethod(id);
      }







for seeing the asmx java script simply call the web service url with trailing /js you will see the methods that you can call. 


Hold Up

3 comments:

Harendra said...

JQuery Ajax callback..easy one...

web lol said...

web lol

Logo design packages said...

I gotta bookmark this website it seems very useful very helpful