Error when trying to get a response from Web API URL via Javascript jQuery call

Question

I've this piece of code which is supposed to get a JSON answer from a localhost site. If I browse this URL from Chrome, I get a good response, but if I try to run this code from the HTML page I get an error (via the VS debug).

Any ideas?

$(document).ready(function () {
  alert("hello");
  var request = $.ajax({
    url: "http://localhost:3157/api/Products",
    type: "GET",
    dataType: "json"
  });
  request.done(function(msg) {
    alert("msg is: " + msg);
  });
  request.fail(function (jqXhr, textStatus) {
    alert("Request failed: " + textStatus);
  });
});

Update - added xml output

<ArrayOfProduct xmlns:i="http://www.w3.org/2001/XMLSchema-instance"     xmlns="http://schemas.datacontract.org/2004/07/FirstWebApi.Models">
    <Product>
        <Category>Groceries</Category>
        <Id>1</Id>
        <Name>Tomato Soup</Name>
        <Price>1</Price>
    </Product>
    <Product>
        <Category>Toys</Category>
        <Id>2</Id>
        <Name>Yo-yo</Name>
        <Price>3.75</Price>
    </Product>
    <Product>
        <Category>Hardware</Category>
        <Id>3</Id>
        <Name>Hammer</Name>
        <Price>16.99</Price>
    </Product>
</ArrayOfProduct>

What error do you get ?

dievardump
– dievardump

2013-07-19 11:34:56 +00:00
Commented Jul 19, 2013 at 11:34 — dievardump
– dievardump, Commented Jul 19, 2013 at 11:34
I simply get the word "error" back on the failure

shahar eldad
– shahar eldad

2013-07-19 11:38:12 +00:00
Commented Jul 19, 2013 at 11:38 — shahar eldad
– shahar eldad, Commented Jul 19, 2013 at 11:38

Manoj Yadav · Accepted Answer · 2013-07-19 11:39:01Z

1

Make sure your respone from url is in json format

answered Jul 19, 2013 at 11:39

Manoj Yadav

6,6121 gold badge25 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

shahar eldad Over a year ago

Tried to set the dataType to xml (which is how I see it in the browser) and also to remove it but it doesn't do the trick.

Brandon J. Boone · Accepted Answer · 2013-07-21 02:53:41Z

0

In order to specify json as the dataType you must return json from the endpoint otherwise you'll get a parse error since the json parser will be invoked explicitly.

Working Demo

Broken Demo

Notice the only difference is the endpoint (html vs json).

You could also try removing the dataType attribute and let jQuery figure it out automatically.

Since your xml is semantically correct, the issue must be in the headers you are sending back. Make sure the response's content type is 'text/xml'

Live Demo

HTML

<script id='xmlData' type='text/html'>
<ArrayOfProduct xmlns:i="http://www.w3.org/2001/XMLSchema-instance"     xmlns="http://schemas.datacontract.org/2004/07/FirstWebApi.Models">
    <Product>
        <Category>Groceries</Category>
        <Id>1</Id>
        <Name>Tomato Soup</Name>
        <Price>1</Price>
    </Product>
    <Product>
        <Category>Toys</Category>
        <Id>2</Id>
        <Name>Yo-yo</Name>
        <Price>3.75</Price>
    </Product>
    <Product>
        <Category>Hardware</Category>
        <Id>3</Id>
        <Name>Hammer</Name>
        <Price>16.99</Price>
    </Product>
</ArrayOfProduct>
</script>

JS

$.mockjax({
  url: '/testXML/',
  responseTime: 0,
  contentType: 'text/xml',
  responseText: $('#xmlData').text()
});

$(document).ready(function () {
    $.ajax({
        url: "/testXML/",
        type: "GET"
    }).done(function(data, textStatus, jqXHR) {
        alert($(data).find('Product:eq(0) > Category').text());
    }).fail(function (jqXhr, textStatus) {
        alert("Request failed: " + textStatus);
    });
});

edited Jul 21, 2013 at 2:53

answered Jul 19, 2013 at 11:39

Brandon J. Boone

16.5k4 gold badges78 silver badges103 bronze badges

3 Comments

shahar eldad Over a year ago

Tried to set the dataType to xml (which is how I see it in the browser) and also to remove it but it doesn't do the trick.

Brandon J. Boone Over a year ago

Is your XML well formed? Is there only 1 parent node? <parent><child></child><child><subchild></subchild></child></parent> would be valid, but <parent><child></child></parent><parent><child></child></parent> would not. All your xml needs to be wrapped by a single parent node.

Brandon J. Boone Over a year ago

You should add the xml response to your question.

shahar eldad · Accepted Answer · 2013-07-21 07:47:05Z

0

After trying to ask someone at work I must have done something differently and got an error message of "No Transport". From there I found the reason & solution here

answered Jul 21, 2013 at 7:47

shahar eldad

8721 gold badge14 silver badges31 bronze badges

Collectives™ on Stack Overflow

Error when trying to get a response from Web API URL via Javascript jQuery call

3 Answers 3

1 Comment

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related