Using two xmlhttprequest calls per page

Question

I have two divisions, <div id=statuslist></div><div id=customerlist></div>

The function sendReq()creates xmlhttprequest and retrieves the data in the division.

sendReq('statuslist','./include/util.php?do=getstatuslist','NULL');

sendReq('customerlist','emphome.php?do=getcustomerlist','NULL');

I have a problem,

Data received in 'customerlist'is copied to'statuslist'

If I change the order of function calls,

sendReq('customerlist','emphome.php?do=getcustomerlist','NULL');

sendReq('statuslist','./include/util.php?do=getstatuslist','NULL');

Now the data 'statuslist'falls into ' customerlist'..

What is the problem with the code?

Answer 1

This is also my problem right now. After careful research, I found out that:

If multiple AJAX tasks are defined on your site, you must create ONE standard function to create the XMLHttpRequest object and call this for each AJAX task - W3Schools.com

, xmlHttpRequests , xmlhttprequest , . , Addsy.

, ONE XMLHttpRequest AJAX. :

function sendReq(url, callbackFunction)
{
    var xmlhttp

    if (window.ActiveXObject)
    {
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else if (window.XMLHttpRequest)
    {
     xmlhttp = new XMLHttpRequest();
    } 

    xmlhttp.onreadystatechange = function()
    {
       if (xmlhttp.readyState==4 && xmlhttp.status=='200')
       {
            if (callbackFunction) callbackFunction(xmlhttp.responseText);
       }
    }

    xmlhttp.open("GET",url,true);
    xmlhttp.send();
}

, . :

sendReq("orders_code_get.php?currentquery="+sql, function processResponse( response )
{
    document.getElementById("orders_content").innerHTML="";
    document.getElementById("orders_content").innerHTML=response;
});

, .

Answer 2

.

- - sendReq()?

if (window.ActiveXObject)
{
 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest)
{
 xmlhttp = new XMLHttpRequest();
} 

, , xmlhttp

, xmlhttp

,

function sendReq(url, callbackFunction)
{
    var xmlhttp

    if (window.ActiveXObject)
    {
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else if (window.XMLHttpRequest)
    {
     xmlhttp = new XMLHttpRequest();
    } 

    ...  probably some other stuff here, setting url etc ...

    xmlhttp.onreadystatechange = function()
    {
       if (xmlhttp.readyState==4&&xmlhttp.status='200')
       {
        if (callbackFunction) callbackFunction(xmlhttp.responseText);
       }
    }

    .. probably more stuff here  ( including xmlhttp.send() ) !! ...

}

, , . , , ( )

, , jQuery - js;)

,

Answer 3

async xhr, , DOM.

, ajax- . , .

var xhrarray={};
for (var j=0; j<itemsvals.length; j++){
                var labelval=itemsvals[j];
                // call ajax list if present.
                if(typeof labelval.mkdajaxlink != 'undefined'){
                    var divlabelvalue = '<div id="' + labelval.mkdid + '_' +          item.mkdcck + '" class="mkditemvalue col-xs-12 ' + labelval.mkdclass + '"><div class="mkdlabel">' + labelval.mkdlabel + ' :</div><div id="'+ j +'_link_'+ labelval.mkdid +'" class="mkdvalue">'+labelval.mkdvalue+'</div></div>';
                    mkdwrapper.find('#' + item.mkdcck + ' .mkdinstadivbody').append(divlabelvalue);

                    xhrarray['xhr_'+item.mkdcck] = new XMLHttpRequest();
                    xhrarray['xhr_'+item.mkdcck].uniqueid=''+ j +'_link_'+ labelval.mkdid +'';
                    console.log(xhrarray['xhr_'+item.mkdcck].uniqueid);
                    xhrarray['xhr_'+item.mkdcck].open('POST', labelval.mkdajaxlink);
                    xhrarray['xhr_'+item.mkdcck].send();
                    console.log('data sent');
                    xhrarray['xhr_'+item.mkdcck].onreadystatechange=function() {
                        if (this.readyState == 4) {
                            console.log(''+this.uniqueid);
                            document.getElementById(''+this.uniqueid).innerHTML = this.responseText;
                        }
                    };
                }
}

You must set each xhr object to a global variable object and define a value xhrarray['xhr_'+item.mkdcck].uniqueid to get its unique identifier and load its result wherever you want.

Hope this helps you in the future.