开发者

how to run javascript during ajax call?

While developing a web app where I'm making great use of javascript php and ajax.

I want to call

display_terminal('feedback_viewer','logs/init-raid-log.txt','Init-Raid');

to build my terminal and call feed_terminal() which has its own setTimeout() recursion call

    var url='../edit_initRaid.php';
    status_text('Initializing raid-array. Please wait a moment...');
    var xmldoc=ajaxPHP2(url,2);

a php file that does nothing more that

exec("sudo /usr/bin/./init-raid-drives-web.sh");

and this is where I fail. This next line is not executed until after the exec() in the php file returns to the php file and the php file returns to the javascript. Not that it matters, but I am pretty sure it did not used to be this way, as originally the bash script would execute over a time period of 2 minutes and the javascript would successfully be updating the html with feed_terminal. this is not the case anymore.

alert("javascript has returned from ajax call");
    if (xmldoc) {
            status_text('Raid-array initialized successfully. System will now restart.You must re-login to FDAS-Web.');

Below is a bunch of code for your questions

Ultimately my question is, how can I run javascript DURING the ajax call? Or maybe my question should be, how can I have edit_initRaid return an xmldoc, without waiting for the exec() to return, or how can i have the exec() return even without the script completing?

function initRaidArray(){
if (document.getElementById('initRaid_doubleCheck')){
    if (document.getElementById('initRaidHideButtonSpot'))
            document.getElementById('initRaidHideButtonSpot').innerHTML = '';
开发者_开发知识库
    var spot=document.getElementById('initRaid_doubleCheck');
    spot.innerHTML='';
    spot.innerHTML='This may take a few moments. Please wait.';
}
    display_terminal('feedback_viewer','logs/init-raid-log.txt','Init-Raid');
    var url='../edit_initRaid.php';
    status_text('Initializing raid-array. Please wait a moment...');
    var xmldoc=ajaxPHP2(url,2);
alert("javascript has returned from ajax call");
    if (xmldoc) {
            status_text('Raid-array initialized successfully. System will now restart. You must re-login to FDAS-Web.');
    }
}

where display_terminal() does two things, builds a table and appends it to the page, and calls feed_terminal(logfile,bigDiv,0)

function feed_terminal(logFile,bigD,lap){
    // AJAX
    bigD.innerHTML = '';
    var url='../view_xml_text.php';
    /*
     * lap(0)=clear file , lap(1)=do not clear file
     */
    url+='?logFile='+logFile+'&lap='+lap;
    var XMLdoc=ajaxPHP2(url,2);
    var xmlrows = XMLdoc.getElementsByTagName("line");

alert("xmlrows.length=="+xmlrows.length);
    // empty file
    if (xmlrows.length==0){
            var d = document.createElement('div');
            var s = document.createElement('span');
            s.innerHTML='...';
            d.appendChild(s);
            bigD.appendChild(d);
    } else {
            // Parse XML
            for (var i=0;i<xmlrows.length;i++){
                    if (xmlrows[i].childNodes[0]){
                            if (xmlrows[i].childNodes[0].nodeValue){
                                    var d = document.createElement('div');
                                    var s = document.createElement('span');

                                    s.innerHTML=xmlrows[i].childNodes[0].nodeValue;
                                    d.appendChild(s);
                                    bigD.appendChild(d);
                            }
                    }
            }
    }
    setTimeout(function(){feed_terminal(logFile,bigD,1)},2000);
}

where the most important item is the setTimeout() call to continue reaching out to the php file which returns xml of the lines in the file, simply.

function ajaxPHP2(url,key)
{
    if (window.XMLHttpRequest) {
            xml_HTTP=new XMLHttpRequest();
            if (xml_HTTP.overrideMimeType) {xml_HTTP.overrideMimeType('text/xml');}
    } else { xml_HTTP=new ActiveXObject("Microsoft.xml_HTTP"); }
    xml_HTTP.open("GET",url,false);
    xml_HTTP.send(null);
    if (key){return xml_HTTP.responseXML;}
}


You need to tell Javascript to do your XHR call asynchronously.

Change

xml_HTTP.open("GET",url,false);

to

xml_HTTP.open("GET",url,true);

But first, you'll need to tell it to do something when the request completes (a callback):

xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        alert(xmlhttp.responseText);
    }
  }
xmlhttp.open("GET",url,true);
xmlhttp.send();

One recommendation: XHR is a pain. It would be a lot easier to use something like jQuery's $.ajax()


You need to set your ajax call to be asynchronous. In the ajaxPHP2 function, the line xml_HTTP.open("GET", url, false); is what is causing the page to pause. The false parameter is telling the ajax call to make everything else wait for it. Change the false to true so it looks like this:

xml_HTTP.open("GET", url, true);

You may also need to attach a function to the onreadystatechange property so that when the ajax call returns it knows what to do. See these links for more information.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜