11 Replies - 3748 Views - Last Post: 17 April 2013 - 12:08 PM

#1 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Handling response from an ASP.NET web service using Jquery's Ajax

Posted 15 April 2013 - 05:57 AM

I have this response coming from a ASP.NET web service

<string xmlns="http://Walkthrough/XmlWebServices/">
    {"approverName":"","emailAddress":"","companyName":"ABC","address":{"streetAddress1":"12 BlahBlah","streetAddress2":"","state":"ON","zipCode":"","country":"SO","phoneNumber":""},"tabledata:"[{"vendorPart":"AAAAA","partDescription":"N/A","price":"0.00","quantity":"28"},{"vendorPart":"BBBBBBB","partDescription":"N/A","price":"0.00","quantity":"3"},{"vendorPart":"CCCCCC","partDescription":"N/A","price":"0.00","quantity":"25"}]}
    </string>


which is being called with this jquery function:

   $(document).ready(function() {
                    $.ajax({
                    type: "POST",
                    url: "http://www.webservice.com/blahblah.asmx/blahb123",
                    data: "tnWsGuid=TEST1",
                    dataType: "script",
                        success: function(msg)
                        {
                            alert("sucess")
                        },
                        error: function(e)
                        {
                            alert(JSON.stringify(e));                       
                        }
                        });
                });


My first question is this, I was having 403 forbidden issues with this function but omitting the contentType changed that. Then I was getting XML parsing issue and on a whim changing the dataType to script fixed that and gave me a response and I hit the success function. Why did that work?

I also would like to know how I can print out this data, because trying to treat it as json won't work, neither does XML.

In chrome I receive this warning:

Resource interpreted as Script but transferred with MIME type text/xml: "http://www.webservice.com/blahblah.asmx/blahb123?tnWsGuid=TEST1&_=1366025879568."


The part appended to the end of this url is confusing me (after TEST1).
In the console I also get this error in chrome:

Uncaught SyntaxError: Unexpected token < 


Firebug gives me:

SyntaxError: syntax error
     [Break On This Error] 	
    
    <?xml version="1.0" encoding="utf-8"?>
    <string xmlns="http://Walkthrough/XmlWebServices/">
        {"approverName":"","emailAddress":"","companyName":"ABC","address":{"streetAddress1":"12 BlahBlah","streetAddress2":"","state":"ON","zipCode":"","country":"SO","phoneNumber":""},"tabledata:"[{"vendorPart":"AAAAA","partDescription":"N/A","price":"0.00","quantity":"28"},{"vendorPart":"BBBBBBB","partDescription":"N/A","price":"0.00","quantity":"3"},{"vendorPart":"CCCCCC","partDescription":"N/A","price":"0.00","quantity":"25"}]}
        </string>


So basically now that the dataType is script I get some sort of response but still have no idea how to parse this data. Preferably into a html table.

I add that I have googled a ton before posting on this and just haven't turned anything useful up.

I hope you can help! Thanks for reading!

Is This A Good Question/Topic? 0
  • +

Replies To: Handling response from an ASP.NET web service using Jquery's Ajax

#2 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 15 April 2013 - 06:19 AM

Also here is the header information logged by Firebug here
Was This Post Helpful? 0
  • +
  • -

#3 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3530
  • View blog
  • Posts: 10,180
  • Joined: 08-June 10

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 15 April 2013 - 06:46 AM

letís look at the errors a bit more detailed:

View PostMannyG, on 15 April 2013 - 02:57 PM, said:

My first question is this, I was having 403 forbidden issues with this function but omitting the contentType changed that. Then I was getting XML parsing issue and on a whim changing the dataType to script fixed that and gave me a response and I hit the success function. Why did that work?

That you have to ask the webservice. some are particularly strict in what they expect and what not.

besides that, contentType =/= dataType!

jQuery Docs said:

contentType (default: 'application/x-www-form-urlencoded; charset=UTF-8')
Type: String
When sending data to the server, use this content type. Default is "application/x-www-form-urlencoded; charset=UTF-8", which is fine for most cases. If you explicitly pass in a content-type to $.ajax(), then it'll always be sent to the server (even if no data is sent). If no charset is specified, data will be transmitted to the server using the server's default charset; you must decode this appropriately on the server side.

jQuery Docs said:

dataType (default: Intelligent Guess (xml, json, script, or html))
Type: String
The type of data that you're expecting back from the server. If none is specified, jQuery will try to infer it based on the MIME type of the response (an XML MIME type will yield XML, in 1.4 JSON will yield a Javascript object, in 1.4 script will execute the script, and anything else will be returned as a string).

in short:
- contentType is the HTTP header of the same name
- dataType is how jQuery treats the Response


View PostMannyG, on 15 April 2013 - 02:57 PM, said:

I also would like to know how I can print out this data, because trying to treat it as json won't work, neither does XML.

that might be just because the XML contains only a single element (a string) and the JSON ainít parsed, so it is just a string (not exactly sure, whether the JSON parser ignores the XML part or if it throws an error there).


View PostMannyG, on 15 April 2013 - 02:57 PM, said:

In chrome I receive this warning:

Resource interpreted as Script but transferred with MIME type text/xml: "http://www.webservice.com/blahblah.asmx/blahb123?tnWsGuid=TEST1&_=1366025879568."

well, that was about to happen. the server sent an XML Content-Type header, and XML is not a script.


View PostMannyG, on 15 April 2013 - 02:57 PM, said:

So basically now that the dataType is script I get some sort of response but still have no idea how to parse this data.

this might offer a clue:

jQuery Docs said:

dataType [...]
"script": Evaluates the response as Javascript and returns it as plain text. Disables caching by appending a query string parameter, "_=[TIMESTAMP]", to the URL unless the cache option is set to true. Note: This will turn POSTs into GETs for remote-domain requests.


parsing the response is your responsibility, you have to think of how to turn the data into HTML.
Was This Post Helpful? 0
  • +
  • -

#4 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 15 April 2013 - 08:35 AM

Hey Dormilich,

Firstly thank you for your reply. I did not intend to specifically have the parsing written but just some guidance. So I do believe I know what the problem is I just have no idea how to start to fix it.

As you stated dataType is how jquery treat's the response, since this is only working as script it is treating the response as javascript. I do not know how to interpret the result I am getting, even trying to print the data as it is doesn't display anything. I think the contentType header I get as a response is throwing this whole thing off. Changing the content type to the appropriate type based on the javascript doesn't help, since the response seem's to be embedded with xml. This is what I believe to be the issue and I have absolutely no idea where to go from here. I just need to know how I can access this data, I think once I have the data in my hand's I can parse it as html.

Any ideas?

I appreciate your response from before it really helped me understand a lot of what was going on.
Was This Post Helpful? 0
  • +
  • -

#5 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3530
  • View blog
  • Posts: 10,180
  • Joined: 08-June 10

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 15 April 2013 - 10:54 AM

Quote

As you stated dataType is how jquery treat's the response, since this is only working as script it is treating the response as javascript.

thatís somewhat odd. how jQuery treats the response is not in the least interesting for the server. (though it may be that the webservice denies POST requests)


Quote

I think the contentType header I get as a response is throwing this whole thing off.

thereís nothing you can do about that, the Content-Type header is determined by the server (and when looking at the response, you get an XML file).


Quote

Changing the content type to the appropriate type based on the javascript doesn't help, since the response seem's to be embedded with xml.

the Content-Type *you* send (i.e. the Request Content-Type) needs to fit *your* data (i.e. a POST request uses a different Content-Type than a GET Request). Additionally, the Request Content-Type is not related to the Response Content-Type (they *may* be the same, but they are usually not). you may also want to read about the HTTP (protocol) to get an idea, what each header is for.


Quote

I just need to know how I can access this data, I think once I have the data in my hand's I can parse it as html.

you already have the data (a JSON string inside an XML document). though you wonít get that parsed as HTML automatically.



the very first thing you need to do is find out what the webservise expects from your request (GET or POST, certain parameters, etc.).
Was This Post Helpful? 0
  • +
  • -

#6 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 17 April 2013 - 08:13 AM

I have fixed this issue and successfully have it working on IE returning the dataset (not yet working on Chrome and Firefox due to the asynchronous problem with the two which I hope will be fixed when hosting this page). I added
$.support.cors = true;
right before the ajax function and my new success function properly show's the data like so:

function(data, status, jqxhr) { 
      xmlString = data;
      alert(xmlString); 
}


Alert display's this:

<?xml version="1.0" encoding = "utf-8"?>
<string xmlns = "http://Walkthrough/XmlWebServices/">
{"approverName":"","emailAddress":"","companyName":"ABC","address":{"streetAddress1":"12 BlahBlah","streetAddress2":"","state":"ON","zipCode":"","country":"SO","phoneNumber":""},"tabledata:"[{"vendorPart":"AAAAA","partDescription":"N/A","price":"0.00","quantity":"28"},{"vendorPart":"BBBBBBB","partDescription":"N/A","price":"0.00","quantity":"3"},{"vendorPart":"CCCCCC","partDescription":"N/A","price":"0.00","quantity":"25"}]}
</string>


My dataType is now text. I know how to parse JSON however, now what I need to do is somehow access the JSON embedded in the XML envelope and turn it into a JSON object so I can use JQuery to parse it.

Here is what I have tried in the $.ajax function:

success: function(data, status, jqxhr) {
                     xmlString = data;
                     var jsondata = jQuery.parseJSON(xmlString.substr(xmlString.indexOf('{')));
					 alert(jsondata);
                 }


But was returned with an error of Invalid character which in the IE debugger show's as the image below.
Posted Image

Any idea how I can access the data inside the xml envelope and turn it into a JSON object so I can parse it as JSON?
Was This Post Helpful? 0
  • +
  • -

#7 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 17 April 2013 - 10:06 AM

This problem has been fixed with the following code in my success function:

var xml = $($.parseXML(data)), // Parse the XML String to a Document, and Wrap jQuery
					json = xml.find("string").text(), // Get the text of the XML
					jsonObj = $.parseJSON(json); // Parse the JSON String

Was This Post Helpful? 0
  • +
  • -

#8 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3530
  • View blog
  • Posts: 10,180
  • Joined: 08-June 10

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 17 April 2013 - 11:34 AM

hm, why parsing the string as XML when the XMLHttpRequest delivers a ready parsed XML document?
Was This Post Helpful? 0
  • +
  • -

#9 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 17 April 2013 - 11:38 AM

This is because as of now the dataType is set to text since when it is set as xml it will not work, checking the headers it accepts show's it want's text/html so this is why I believe it must work this way. By the way just wondering do you know how I can populate a html input field ? I need to put some of this data into a input field, basically what I want to do is something like jsonObj.companyName will display the company name in the input text field.

This post has been edited by Dormilich: 17 April 2013 - 11:46 AM

Was This Post Helpful? 0
  • +
  • -

#10 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3530
  • View blog
  • Posts: 10,180
  • Joined: 08-June 10

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 17 April 2013 - 11:55 AM

hm, but text/html isnít text either (that would be text/plain).


Quote

checking the headers it accepts show's it want's text/html

I wonder where you found that? the Responseís Content-Type header has nothing to do with the Requestís Content-Type (and you usually do not send HTML as Request either). And the Accept header only tells the server what type of data the client is willing to process.

Web services usually have an API or at least a description, was is expected.


Quote

By the way just wondering do you know how I can populate a html input field ?

sure, check out the value property.
Was This Post Helpful? 0
  • +
  • -

#11 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 17 April 2013 - 12:01 PM

Ah yes sorry I meant text/plain not text/html.

This post has been edited by Dormilich: 17 April 2013 - 12:09 PM

Was This Post Helpful? 0
  • +
  • -

#12 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Handling response from an ASP.NET web service using Jquery's Ajax

Posted 17 April 2013 - 12:08 PM

BTW thanks for tip using value, I got it working using this

$('#address1').val(jsonObj.address.streetAddress1);

I had address tagged as the name for the input instead of the id, so I had to change that.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1