CODEWITHSUNDEEP
javascriptjquery
Chelseawillrecover
Chelseawillrecover

Reputation: 2644

The error function not working

Hi I just tried testing if the error function would return an alert but it didn't fire. I altered the url link hoping that it would generate an alert since it won't be able to find or get json data. All I am getting is "Uncaught TypeError: Cannot read property 'length' of undefined jquery-1.9.1.min.js:3"

$(document).on('pagebeforeshow', '#blogposts', function () {
    //$.mobile.showPageLoadingMsg();    
    $.ajax({
        url: "http://howtodeployit.com/api/get_recent_po",
        dataType: "json",
        jsonpCallback: 'successCallback',
        async: true,
        beforeSend: function () {
            $.mobile.showPageLoadingMsg(true);
        },
        complete: function () {
            $.mobile.hidePageLoadingMsg();
        },
        success: function (data) {
            $.each(data.posts, function (key, val) {
                console.log(data.posts);
                var result = $('<li/>').append([$("<h3>", {
                    html: val.title
                }), $("<p>", {
                    html: val.excerpt
                })]).wrapInner('<a href="#devotionpost" onclick="showPost(' + val.id + ')"></a>');
                $('#postlist').append(result).trigger('create');
                return (key !== 4);
            });
            $("#postlist").listview();
        },
        error: function (data) {
            alert("Data not found");
        }

    });
});

Upvotes: 1

Views: 325

Answers (4)

Chelseawillrecover
Chelseawillrecover

Reputation: 2644

Thanks everyone for your input. I did take on-board all suggestions. Recommendation from Jason seems to had made more sense so while investigating his suggestion I came to this site to read up more about jasonCallback. removing the jasonCallback option though did not fix the issue but strangely this issue seems to do with the url I was using for my json caalback.

What I then did was to change the url from "http://howtodeployit.com/api/get_recent_po" to "http://howtodeployit.com/category/daily-devotion/feed/?json=recentstories" and it worked. Even though both returned error in the console but the second was the one that triggered the error function. Why I am looking into it.

Upvotes: 0

Sebastian vom Meer
Sebastian vom Meer

Reputation: 5241

I created a clean Fiddle. Opening the given URL gives a 301 redirect followed by a 200 JSON response. The HTTP status code says that everything is fine, so jQuery doesn't know there was an error.

You mixed up two different concepts here: jQuery's error callback is for network errors and all these things. If you transport error states inside your JSON with HTTP status code 200 you have to deal with it on your own inside the success callback.

Sorry, SO doesn't allow JS-Fiddle links without code:

beforeSend: function()  { console.log('beforeSend'); },
complete: function()    { console.log('complete'); },
success:function (data) { console.log('success') },
error: function(data)   { console.log('error') }

Upvotes: 0

Jason Evans
Jason Evans

Reputation: 29186

I think the problem is that, when you make the AJAX request your code is executing the success callback, not the error callback. Thus when you execute:

$.each(data.posts, function(key, val) {

The $.each function is trying to get the length of data which is NULL.

It doesn't look right that you have defined a jsonp callback function and yet your still using the success and error callbacks. This SO question might help a bit :

Use of success / jsonpCallback with ajax request

Upvotes: 1

karaxuna
karaxuna

Reputation: 26930

Maybe here $.each(data.posts, data.posts is undefined and that's why you get an error. Log data in success callback and see what it contains.

Upvotes: 0

Related Questions