CODEWITHSUNDEEP
ajaxjqueryasp.net-web-api
Mike Marks
Mike Marks

Reputation: 10139

Trying to make an Ajax call to my Web API, not working, getting error

Both the WebAPI and the Website are sitting on localhost:80, so cross-domain shouldn't be an issue. Here's my client-side code:

$(document).ready(function() {
            $.ajax({
                type: 'GET',
                url: 'http://localhost/SixFilmWebAPI/api/SixFilm/60',
                dataType: "json",
                success: function (data) { WriteResponse(data); },
                error: function (err) { alert('error!'); },
            });
        });

        function WriteResponse(actors) {
            var strResult = "<table><th>Name</th><th>Dob</th><th>Dod</th>";
            $.each(actors, function (index, actor) {
                strResult += "<tr><td>" + message.Name + "</td><td> " + message.Dob + "</td></tr>" + message.Dod + "</td></tr>";
            });
            strResult += "</table>";
            $("#divResult").html(strResult);
        }

Each time I run my website, the error callback function gets hit, but, looking in Fiddler, I am getting my JSON object returned with a 200 OK response. Manually navigating to the WebAPI URL also returns JSON. What am I doing wrong???

Upvotes: 0

Views: 1454

Answers (1)

Darin Dimitrov
Darin Dimitrov

Reputation: 1039498

Both the WebAPI and the Website are sitting on localhost:80, so cross-domain shouldn't be an issue.

In this case use relative url:

url: '/SixFilmWebAPI/api/SixFilm/60'

Then open your web browsers developer toolbar and inspect the Network tab. For example in Google Chrome's developer toolbar you will see the exact request being sent to the server and the response status code and body. This would give you a pretty good indication of what might have gone wrong.

Also place breakpoints inside your controller action and see if it gets hit. If it doesn't it's a routing or binding issue. In all cases the developer toolbar of your browser will help you sort it out. Also keep an eye on the Console tab which is where potential javascript errors and XHR warnings will be shown. Then look inside the success callback. Does it get hit? Did you return a JSON array from your Web API? Because from what I can see you are attempting to loop through the actors variable over there. So make sure that your server returned a JSON like this:

[
    { "Name":"foo", "Dob":"2010-11-01", "Dod":"2013-07-01" },
    { "Name":"bar", "Dob":"1967-05-17", "Dod":"2001-04-21" }
]

Upvotes: 2

Related Questions