How to use jQuery to call an ASP.NET web service?

Question

I am trying to use jQuery to retrieve data from an ASP.NET web service (SharePoint Server 2007 lists.asmx), but any call to the web service will really help as a first step in that direction.

Answer 1

I use this method as a wrapper so that I can send parameters. Also, the use of variables at the top of the method allows you to minimize it with a higher coefficient and allows you to reuse the code when making several similar calls.

function InfoByDate(sDate, eDate){ var divToBeWorkedOn = "#AjaxPlaceHolder"; var webMethod = "http://MyWebService/Web.asmx/GetInfoByDates"; var parameters = "{'sDate':'" + sDate + "','eDate':'" + eDate + "'}"; $.ajax({ type: "POST", url: webMethod, data: parameters, contentType: "application/json; charset=utf-8", dataType: "json", success: function(msg) { $(divToBeWorkedOn).html(msg.d); }, error: function(e){ $(divToBeWorkedOn).html("Unavailable"); } }); } 

I hope this helps.

Note that this requires the 3.5 framework to display JSON web methods that can be used in this way.

Answer 2

Here is an example of calling your web service using jQuery.get:

 $.get("http://domain.com/webservice.asmx", { name: "John", time: "2pm" }, function(data){ alert("Data Loaded: " + data); }); 

In the above example, we call "webservice.asmx" by passing two parameters: name and time. Then, having received the service exit in the callback function.

Answer 3

I don’t know about this particular SharePoint web service, but you can decorate the page method or web service with <WebMethod()> (in VB.NET) to make sure it is serialized in JSON. You can probably just wrap the method that webservice.asmx uses internally in your own web service.

Dave Ward a good walkthrough on this.

Answer 4

 $.ajax({ type: 'POST', url: 'data.asmx/getText', data: {'argInput' : 'input arg(s)'}, complete: function(xData, status) { $('#txt').html($(xData.responseXML).text()); // result } }); 

Answer 5

I have a decent example in jQuery AJAX and ASMX when using jQuery AJAX call with asmx web services ...

There is some line of code to return JSON.

Answer 6

SPServices is a jQuery library that abstracts and simplifies the use of SharePoint Web Services.

certified for SharePoint 2007

A list of supported operations for List.asmx can be found here.

Example

In this example, we grab all the items in the Announcements list and show the headers in the bulleted list in the taskUL div:

 <script type="text/javascript" src="filelink/jquery-1.6.1.min.js"></script> <script type="text/javascript" src="filelink/jquery.SPServices-0.6.2.min.js"></script> <script language="javascript" type="text/javascript"> $(document).ready(function() { $().SPServices({ operation: "GetListItems", async: false, listName: "Announcements", CAMLViewFields: "<ViewFields><FieldRef Name='Title' /></ViewFields>", completefunc: function (xData, Status) { $(xData.responseXML).SPFilterNode("z:row").each(function() { var liHtml = "<li>" + $(this).attr("ows_Title") + "</li>"; $("#tasksUL").append(liHtml); }); } }); }); </script> <ul id="tasksUL"/> 

Answer 7

I pretty often use ajaxpro with jQuery. ajaxpro allows me to call .NET functions from JavaScript, and I use jQuery for the rest.