Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 47 down vote favorite
28

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

share|improve this question
How would an ASP.NET service be any different from a service running on Tomcat? In other words: I don't think it matters at all what software the server is running. – nilamo Aug 4 '10 at 16:22
add comment (requires an account with 50 reputation)

8 Answers

up vote 51 down vote accepted

I use this method as a wrapper so that I can send parameters. Also using the variables in the top of the method allows it to be minimized at a higher ratio and allows for some code reuse if making multiple 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");              
        }
    });
}

Hope that helps.

please note that this requires the 3.5 framework to expose JSON webmethods that can be consumed in this manner

share|improve this answer
is this line: "var webMethod = 'MyWebService/Web.asmx/GetInfoByDates'"; missing a semi-colon on purpose? – matthew_360 Sep 25 '12 at 23:21
nope ... wouldn't have hurt but I added them for clarity – Bobby Borszich Sep 27 '12 at 17:14
Is there a way to actually view the error message? mine keeps saying unavailable but I need to view the actual error, thank you – KamalSalem Dec 21 '12 at 11:39
if you use firebug or the console in chrome just store "e" in a variable and then inspect it. i.e. window.ZZZ = e; – Bobby Borszich Jan 2 at 17:16
@Bobby, I have follow the steps mentioned in your answer and I am able to call Web service. Its working fine in chrome, but when I tried the same one in firefox, I am getting 0 in response, do you have any idea ? Thanks – Muhammad Akhtar Jan 8 at 17:03
add comment (requires an account with 50 reputation)
up vote 11 down vote

The problem with @mnour source is that jQuery is not going to be able to deserialize the WSDL file returned. You need to make sure it is deserialized in JSON or XML.

share|improve this answer
Could you provide references or example sources so that I could improve the question and answers? – Simara Sep 2 '10 at 20:04
add comment (requires an account with 50 reputation)
up vote 7 down vote

Here is an example to call your webservice using jQuery.get:

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

In the later example, you call "webservice.asmx", giving it 2 parameters: name and time. Then, a function is called in callback.

share|improve this answer
add comment (requires an account with 50 reputation)
up vote 3 down vote

I don't know about that specific SharePoint web service, but you can decorate a page method or a web service with <WebMethod()> (in vb.net) to ensure that it serializes to JSON. You can probably just wrap the method that webservice.asmx uses internally, in your own web service.

Dave Ward has a nice walkthrough on this.

share|improve this answer
add comment (requires an account with 50 reputation)
up vote 3 down vote

I have a decent example here on using the JQuery AJAX call with asmx web services... http://sonerdy.com/JQuery-AJAX-and-ASMX

There is a line of code to uncommment in order to have it return JSON.

share|improve this answer
add comment (requires an account with 50 reputation)
up vote 1 down vote 
$.ajax({
 type: 'POST',
 url: 'data.asmx/getText',
 data: {'argInput' : 'input arg(s)'},
 complete: function(xData, status) {
 $('#txt').html($(xData.responseXML).text()); // result
 }
});
share|improve this answer
add comment (requires an account with 50 reputation)
up vote 0 down vote

I quite often use ajaxpro along with jquary. ajaxpro lets me call .net functions from JS and I use jquary for the rest.

share|improve this answer
add comment (requires an account with 50 reputation)
up vote 0 down vote

SPServices is a jQuery library which abstracts SharePoint's Web Services and makes them easier to use

It is certified for SharePoint 2007

The list of supported operations for Lists.asmx could be found here

Example

In this example, we're grabbing all of the items in the Announcements list and displaying the Titles in a bulleted list in the tasksUL 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"/>
share|improve this answer
add comment (requires an account with 50 reputation)

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.