Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why does IE8 error on $.post() ["Object doesn't support this property or method"]?

I've searched high and low, but can't find this even being mentioned. Using jQuery 1.4.4 (and no other library), this so far only happens on Internet Explorer 8. The error is "Object doesn't support this property or method", and the line it points to is below, at $.post(.

The JS

The HTML is unexceptional, so I'm just going to post JS.

$(window).load(function(){

$("input[type='submit']", ".scope").live("click", function(e){
    e.preventDefault();
    // some intervening code defining variables used below...

    //only var which is at all complex
    var inputs = $form.find(":input").serializeArray();

    $.post(
        action,
        inputs,
        function(data){
            var $json = $.parseJSON(data);
            if ( $json.success == true ) {
                if ( testVar == 2 ) {
                    if ( $json.tabkill == true ) {
                        killTab(tabID);
                    } else {
                        loadPane(rID,tabID,"refreshTop");
                    }
                } else {
                    loadPane(rID,tabID);
                }
            } else {
                //modal dialogue error message, excised
            }
        }
    ).ajaxError(function(e, xhr, settings, exception) {
        if (settings.url == action) {
            alert("Problem calling: "+settings.url+"\n code: "+xhr.status+"\n exception: "+exception);
        }
    });

    return false;
});

//end window load block
});

2 Answers

The problem is with your line ajaxError.

The problem is that $.post returns an XMLHTTPRequest object, not a jQuery selection. ajaxError must be called on a jQuery selection.

There are two safe ways around this:

1) Upgrade to jQuery 1.5. This introduces a new XMLHTTPRequest wrapper object jqXHR. You can use the error handler in the way that you are attempting:

$.post(
    action,
    inputs,
    function(data){
        /* ... */
    }
).error(function(){
    alert ("Problem calling: " + action + "\nCode: " + this.status + "\nException: " + this.statusText);
});

2) Use a call direct to $.ajax and set an error handler:

$.ajax({
    url: action,
    data: inputs,
    success: function(data){
        /* ... */
    },
    error: function(xhr, textStatus, error) {
        alert("Problem calling: " + action + "\nCode: " + xhr.status + "\nException: " + textStatus);
    }
});
like image 65
lonesomeday Avatar answered Feb 19 '26 06:02

lonesomeday


It is because the ajaxError()(docs) method needs to be called against a jQuery object, and the $.post()(docs) method returns an XMLHttpRequest object.

Not sure why you don't get an error in other browsers.

like image 34
user113716 Avatar answered Feb 19 '26 08:02

user113716