Ajax Get

First of all verify Server side.

1. Rename webmethods.aspx to webmethods.asmx.

2. Verify that you placed  Inside of \ and  a httpHandlers for asmx extension (ScriptHandlerFactory) also exist in the config:

   <configuration><!--...--><system.web><webServices><protocols><add name="HttpGet"/></protocols></webServices><httpHandlers><!--...--><add verb="*" path="*.asmx"
              type="System.Web.Script.Services.ScriptHandlerFactory"
              validate="false"/></httpHandlers></system.web></configuration>

3. Verify that [ScriptService] attribute ([System.Web.Script.Services.ScriptService] if you like full names) set for your class inherited from System.Web.Services.WebService.

Now you could test the service. Open in you Web-Browser URL like http://localhost/webmethods.asmx/AjaxGet?id=li1234 If you receive back something like <?xml version="1.0" encoding="utf-8" ?> <string xmlns="http://tempuri.org/">li1234</string>

You can be sure that you service part works fine.

Remark: Independ on “ResponseFormat = System.Web.Script.Services.ResponseFormat.Json” attribute the service answer with XML responses if “Content-Type:application/json;” not set  in the request.

Now we’ll fix the client code. I hope that comments which I placed in the following code explain all.

One more small remark. In the last part of code I call one more “complex” web method:

[WebMethod][ScriptMethod(UseHttpGet=true,ResponseFormat=ResponseFormat.Json)]publicOutputDataAjaxGetMore(InputData input){returnnewOutputData(){
        id = input.id,
        message ="it's work!",
        myInt = input.myInt+1};}

Where

publicclassOutputData{publicstring id { get;set;}publicstring message { get;set;}publicint myInt { get;set;}}publicclassInputData{publicstring id { get;set;}publicint myInt { get;set;}}

Now only JavaScript code which use in some places JSON plugin, which could be replaced with Crockford's json2.js, if somebody prefer it.

var id ="li1234";
// version 1 - worksvar idAsJson ='"'+ id +'"';// string serializes in JSON format
$.ajax({
    type:"GET",
    url:"/webmethods.asmx/AjaxGet?id="+ idAsJson,
    contentType:"application/json; charset=utf-8",
    success: function(msg){
        alert(msg.d);// var msg = {d: "li1234"} },
    error: function(res, status){if(status ==="error"){// errorMessage can be an object with 3 string properties: ExceptionType, Message and StackTracevar errorMessage = $.parseJSON(res.responseText);
            alert(errorMessage.Message);}}});
// version 2 with respect of JSON plugin
$.ajax({
    type:"GET",
    url:"/webmethods.asmx/AjaxGet?id="+ $.toJSON(id),
    contentType:"application/json; charset=utf-8",
    success: function(msg){
        alert(msg.d);// var msg = {d: "li1234"} },
    error: function(res, status){if(status ==="error"){// errorMessage can be an object with 3 string properties: ExceptionType, Message and StackTracevar errorMessage = $.parseJSON(res.responseText);
            alert(errorMessage.Message);}}});
// version 3 where jQuery will construct URL for us
$.ajax({
    type:"GET",
    url:"/webmethods.asmx/AjaxGet",
    data:{id: $.toJSON(id)},
    dataType:"json",
    contentType:"application/json; charset=utf-8",
    success: function(msg){
        alert(msg.d);// var msg = {d: "li1234"} },
    error: function(res, status){if(status ==="error"){// errorMessage can be an object with 3 string properties: ExceptionType, Message and StackTracevar errorMessage = $.parseJSON(res.responseText);
            alert(errorMessage.Message);}}});
// version 4. We set "Content-Type: application/json" about our data, but we use no //            not 'dataType: "json"' parameter. Then we have "Accept: */*" in the request//            instead of "Accept: application/json, text/javascript, */*" before.//            Everithing work OK like before.
$.ajax({
    type:"GET",
    url:"/webmethods.asmx/AjaxGet",
    data:{id: $.toJSON(id)},
    contentType:"application/json; charset=utf-8",
    success: function(msg){
        alert(msg.d);// var msg = {d: "li1234"} },
    error: function(res, status){if(status ==="error"){// errorMessage can be an object with 3 string properties: ExceptionType, Message and StackTracevar errorMessage = $.parseJSON(res.responseText);
            alert(errorMessage.Message);}}});
// version 5. If we don't place "Content-Type: application/json" in our reqest we//            receive back XML (!!!) response with "HTTP/1.1 200 OK" header and //            "Content-Type: text/xml; charset=utf-8" which will be placed.//            How one can read in// http://weblogs.asp.net/scottgu/archive/2007/04/04/json-hijacking-and-how-asp-net-ajax-1-0-mitigates-these-attacks.aspx),//             ASP.NET AJAX will not make JSON serialized of response data for//             security reasons.
$.ajax({
    type:"GET",
    url:"/webmethods.asmx/AjaxGet",
    data:{id: $.toJSON(id)},
    dataType:"json",//contentType: "application/json; charset=utf-8",
    success: function(msg){
        alert(msg.d);// var msg = {d: "li1234"} },
    error: function (res, status, ex){// the code here will be works because of error in parsing server responseif(res.status !==200){// if not OK// we receive exception in the next line, bevar errorMessage = $.parseJSON(res.responseText);
            alert(errorMessage.Message);}else{
            alert("status="+ status +"\nex="+ ex +"\nres.status="+ res.status +"\nres.statusText="+ res.statusText +"\nres.responseText="+ res.responseText);}}});
// version 6. Send more komplex data to/from the servicevar myData ={ id:"li1234", myInt:100}
$.ajax({
    type:"GET",
    url:"/webmethods.asmx/AjaxGetMore",
    data:{input:$.toJSON(myData)},
    dataType:"json",
    contentType:"application/json; charset=utf-8",
    success: function(msg){// var msg = {__type: "Testportal.OutputData", id: "li1234", message: "it's work!", myInt:101}
        alert("message="+ msg.d.message +", id="+ msg.d.id +", myInt="+ msg.d.myInt);},
    error: function(res, status){if(status ==="error"){// errorMessage can be an object with 3 string properties: ExceptionType, Message and StackTracevar errorMessage = $.parseJSON(res.responseText);
            alert(errorMessage.Message);}}});