In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > xml handling > methods > abort (XMLHttpRequest)

abort method (XMLHttpRequest)

Browser support:

Interrupts the current HTTP request.

This function can be used for asynchronous operations. When a request is aborted, the onreadystatechange event handler is not called and the readyState property is set to zero.

Syntax:

object.abort ( );

You can find the related objects in the Supported by objects section below.

Return value:

This method has no return value.

Example HTML code 1:

This example shows how to cancel an HTTP request.

Code

ajax.js

<head>
    <script type="text/javascript" src="ajax.js"></script>
    
    <script type="text/javascript">
        var httpRequest = null;

        function SendRequest () {
            if (!httpRequest) {
                httpRequest = CreateHTTPRequestObject ();   // defined in ajax.js
            }
            if (httpRequest) {          
                    // The requested file must be in the same domain that the page is served from.
                var url = "large.xml";

                httpRequest.open ("GET", url, true);    // async
                httpRequest.onreadystatechange = OnStateChange;
                httpRequest.send (null);

                var abortButton = document.getElementById ("abortButton");
                abortButton.disabled = false;
            }
        }

        function OnStateChange () {
            var output = document.getElementById ("output");
            switch (httpRequest.readyState) {
            case 1:
                output.innerHTML += "The request is opened, but the send method has not been called yet.<br />";
                break;
            case 2:
                output.innerHTML += "The request is sent but no data has been received yet.<br />";
                break;
            case 3:
                output.innerHTML += "A part of the data has been received.<br />";
                break;
            case 4:
                var abortButton = document.getElementById ("abortButton");
                if (!abortButton.disabled) {
                    if (IsRequestSuccessful (httpRequest)) {    // defined in ajax.js
                        output.innerHTML += "All the data has been received.<br/>";
                    }
                    else {
                        output.innerHTML += "<span style='color:red'>Operation failed!</span><br/>";
                    }
                    abortButton.disabled = true;
                }
                break;
            };
        }

        function AbortRequest () {
            var abortButton = document.getElementById ("abortButton");
            abortButton.disabled = true;

            var output = document.getElementById ("output");
            output.innerHTML += "<span style='color:red'>Operation is aborted!</span><br/>";

            httpRequest.abort ();        // aborts the request
        }

    </script>
</head>
<body>
    <button onclick="SendRequest ()">Send request</button>
    <br/><br/>
    <div id="output" style="width:420px; height:200px; overflow:auto; border:1px solid #000000; background-color:#f5e4b1;"></div>
    <br/>
    <button id="abortButton" onclick="AbortRequest ()" disabled="disabled">Abort request</button>
</body>


function CreateHTTPRequestObject () {
        // although IE supports the XMLHttpRequest object, but it does not work on local files.
    var forceActiveX = (window.ActiveXObject && location.protocol === "file:");
    if (window.XMLHttpRequest && !forceActiveX) {
        return new XMLHttpRequest();
    }
    else {
        try {
            return new ActiveXObject("Microsoft.XMLHTTP");
        } catch(e) {}
    }
    alert ("Your browser doesn't support XML handling!");
    return null;
}

function CreateMSXMLDocumentObject () {
    if (typeof (ActiveXObject) != "undefined") {
        var progIDs = [
                        "Msxml2.DOMDocument.6.0", 
                        "Msxml2.DOMDocument.5.0", 
                        "Msxml2.DOMDocument.4.0", 
                        "Msxml2.DOMDocument.3.0", 
                        "MSXML2.DOMDocument", 
                        "MSXML.DOMDocument"
                      ];
        for (var i = 0; i < progIDs.length; i++) {
            try { 
                return new ActiveXObject(progIDs[i]); 
            } catch(e) {};
        }
    }
    return null;
}

function CreateXMLDocumentObject (rootName) {
    if (!rootName) {
        rootName = "";
    }
    var xmlDoc = CreateMSXMLDocumentObject ();
    if (xmlDoc) {
        if (rootName) {
            var rootNode = xmlDoc.createElement (rootName);
            xmlDoc.appendChild (rootNode);
        }
    }
    else {
        if (document.implementation.createDocument) {
            xmlDoc = document.implementation.createDocument ("", rootName, null);
        }
    }
    
    return xmlDoc;
}

function ParseHTTPResponse (httpRequest) {
    var xmlDoc = httpRequest.responseXML;

            // if responseXML is not valid, try to create the XML document from the responseText property
    if (!xmlDoc || !xmlDoc.documentElement) {
        if (window.DOMParser) {
            var parser = new DOMParser();
            try {
                xmlDoc = parser.parseFromString (httpRequest.responseText, "text/xml");
            } catch (e) {
                alert ("XML parsing error");
                return null;
            };
        }
        else {
            xmlDoc = CreateMSXMLDocumentObject ();
            if (!xmlDoc) {
                return null;
            }
            xmlDoc.loadXML (httpRequest.responseText);

        }
    }

            // if there was an error while parsing the XML document
    var errorMsg = null;
    if (xmlDoc.parseError && xmlDoc.parseError.errorCode != 0) {
        errorMsg = "XML Parsing Error: " + xmlDoc.parseError.reason
                  + " at line " + xmlDoc.parseError.line
                  + " at position " + xmlDoc.parseError.linepos;
    }
    else {
        if (xmlDoc.documentElement) {
            if (xmlDoc.documentElement.nodeName == "parsererror") {
                errorMsg = xmlDoc.documentElement.childNodes[0].nodeValue;
            }
        }
    }
    if (errorMsg) {
        alert (errorMsg);
        return null;
    }

        // ok, the XML document is valid
    return xmlDoc;
}

    // returns whether the HTTP request was successful
function IsRequestSuccessful (httpRequest) {
        // IE: sometimes 1223 instead of 204
    var success = (httpRequest.status == 0 || 
        (httpRequest.status >= 200 && httpRequest.status < 300) || 
        httpRequest.status == 304 || httpRequest.status == 1223);
    
    return success;
}