2010年3月24日

[jQuery] Invoke Web service from jQuery

Invoke ASP.Net web service from jQuery. To invoke a web method with parameters, change the data :{} to

   1: data : "{'Para1':'Value1',''Para2':'Value2'}"






   1: <script type="text/javascript" language="javascript">



   2:     function invokeWS() 



   3:     {



   4:         //Set up Button to invoke web service



   5:         $.ajax({



   6:             type: "POST",



   7:             url: "/JQueryTestService.asmx/GetResponseFromWebService",



   8:             data: {},



   9:             contentType: "application/xml; charset=utf-8",



  10:             dataType: "xml",



  11:             success: function (msg) {



  12:                 alert(msg.text);



  13:             },



  14:             error: function (msg) {



  15:                 alert('error:' + msg.responseBody);



  16:             }



  17:         });



  18:     }



  19: </script>




And for the web service





   1: [WebService(Namespace = "http://sampleCodes.michael.com/")]



   2: [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]



   3: [System.ComponentModel.ToolboxItem(false)]



   4: [System.Web.Script.Services.ScriptService]



   5: public class JQueryTestService : System.Web.Services.WebService



   6: {



   7:     [WebMethod]



   8:     public string GetResponseFromWebService()



   9:     {



  10:         return "this is a test!";



  11:     }



  12: }


[jQuery] Quick Note

This is only a note for my first jQuery html page. The following codes allow user to move focus between textbox on the page via arrow keys(Up/Down)

   1: <script type="text/javascript">



   2:     $(function () {



   3:         var total = 0;



   4:         $("input").each(function (i) {



   5:             if ($(this).attr("type") == "text") {



   6:                 $(this).addClass("tabIndexedInput").attr("idx", total++);



   7:             }



   8:         });



   9:         $("input.tabIndexedInput").live("keydown", function (evt) {



  10:             var idx = parseInt($(this).attr("idx"));



  11:             switch (evt.which) {



  12:                 case 38:



  13:                     idx -= 1;



  14:                     break;



  15:                 case 40:



  16:                     idx += 1;



  17:                     break;



  18:             }



  19:             if (idx >= 0) {



  20:                 $("input.tabIndexedInput[idx=" + idx + "]").focus();



  21:                 return false;



  22:             } else {



  23:                 return true;



  24:             }



  25:         });



  26:     });



  27: </script>


About Me