IE page rendering issue (Wait message)

[tusovka]

Because Firefox and IE render web pages differently, I cant get the same results.
I working with many embedded tables that contain javascript functionality inside.

What I have is a table that contains radio buttons. Once the user selects a button, I use the onClick functionality to generate 2 dynamic selectors that are inserted once results come back from DataBase.

I want to display a simple message (Query in progress) until the selectors are generated (2sec). To display the message:
document.getEle mentById('waitQ uery').style.di splay='';
and once the selectors are build remove message:
document.getEle mentById('waitQ uery').style.di splay='';

This works in Firefox, but not in IE. Why, because the table is not complete, that is the selectors are not done yet. So IE does not show the message either. Once the selectors are created, IE executes the Javascript, but so fast that message is not seen, plus in does not make sense to show the message after the wait time passed.

Please, help... I just want a simple message to be Displayed in IE while query in progress...

[Frinavale]

Are you calling the method that displays "waitQuery" during the OnClick event before the 2 selectors are dynamic created?

It may help if you post a code snippet so that we can see what you're doing.

[tusovka]

Are you calling the method that displays "waitQuery" during the OnClick event before the 2 selectors are dynamic created?

It may help if you post a code snippet so that we can see what you're doing.

Yes, Im calling a function that displays the message that is already hard coded in to the span id='waitQuery'

once the selectors are generated I call a similar function that changes the span display to none.
-------------------------------------------------------------------------------

 <input type=\"radio\" name=\"$inputName\" value=\"$build\" 
                					   
          onclick=\"javascript:
         
          
          queryMessageOn(); 
          --
          code that generates selectors
          document.getElementById('tech_selector').innerHTML=techinfo; 
          --
          queryMessageOff(); 

\">

-------------------------------------------------------------------------------

function queryMessageOn(){
    document.getElementById('waitQuery').style.display='';
}
  
function queryMessageOff(){
    document.getElementById('waitQuery').style.display='none';
}

---------------------------------------------------------------------------------

what is (techinfo) = Basically I have a php code that generates a selector and then when that page is done the output is stored in to a span that is the newly generated selector.

You would think IE would atleast display the message because that is the first thing that should happen onclick. Yet, once you click a radio button it everything stands still for the query and then selectors are displayed.

Please ignore all the extra ( " \ ;) because all this stuff is inside php code.

[gits]

how do you send the query? do you use ajax for that purpose? in case you do ... then ensure that it is done async ... otherwise the browser will wait for the query and may show such behaviour ...

kind regards

[tusovka]

how do you send the query? do you use ajax for that purpose? in case you do ... then ensure that it is done async ... otherwise the browser will wait for the query and may show such behaviour ...

kind regards

//techPage() is a javascript function that generates a URL to another php file that actually creates the query. Once the query returns, tech.php generates the appropriate HTML code for the selector. Next, the whole output of that page tech.php is stored in the variable (techinfo) as seen below.

var techinfo=techPa ge(A, B, C, D);

Now, you cant think of the whole code for the selector is inside the techinfo variable. Then next step I do is populate the appropriate <span> that will hold the newly generated selector.

Finally, I want the message to be turned of because the process of generating the selector is complete.

FireFox works great, yet IE(version 7) seems to wait, until the span for the selector is filled.

---

Inside my tech.php I examine the URL, pull out the info I need to generate the query and execute it.

mysqli_connect_ to_server(-----);
mysqli_MY_own_m ySqli_func(-----);
mysqli_disconne ct_from_server( $link);

once everything is done the last two lines in tech.php
flush();
exit;
?>

---

Does any one know how to write a small Javascript function that can tell if a:
query is in not complete, or when the <span> container is populated or is empty onChange type of approach.

[gits]

as i said ... do you use an ajax-call for the query? without doing so the browser just waits for the response ... while an ajax call could be done async and tells you when it would be complete. since that would run in the background the browser would even be responsive during the call ...

kind regards

[Frinavale]

Gits, if the OP is not using Ajax, could they use the setTimeout() method to display the "Please Wait" message?


Eg:

  setTimeout(queryMessageOn(), 100); 
  //.....
  queryMessageOff();

[gits]

you shouldn't use it and typically you do not but: of course you could do ... but couldn't that be the problem? ... and just to confirm that i asked the OP whether he uses the XMLHttpRequest or not ...

[gits]

ahh ...wait Frinny ;) ... was that a question? ... in case it was ... then the answer would be to not doing so .... don't know every browsers behaviour ... but doing sync requests will cause the browser to block execution of code ... in favour of waiting for the response ... may be that you would have luck with the timeout in one browser ... but in others it might fail. the best and most reliable way is to do an async XMLHttpRequest (aka: ajax-call) ...

kind regards

[tusovka]

as i said ... do you use an ajax-call for the query? without doing so the browser just waits for the response ... while an ajax call could be done async and tells you when it would be complete. since that would run in the background the browser would even be responsive during the call ...

kind regards

Gits,

I'm not sure i have never seen ajax before. Plus, this code was thrown at me, and I need to slowly understand it and modify it. Could you post a simple ajax call query.
The only place I see the query being executed is in a php format. Sorry if I did not answere you the first time. All of this is new to me.

Frinavale,

I tried using the setTimeout(quer yMessageOn(), 100); in my Javascript portion.
That is after you click a radio button selection.
The result is:
First, there is the initial wait for the query (2sec) then we see the selector plus the message. Once the time is up the message is errased. So basically we are at the same place.
The message does not appear will the query is in progress. Insted it appears after the selector is generated and displayed. Note, this is only in IE not Firefox.

Any exaples of Ajax would be nice.

[gits]

you find a quick intro here and here ... at the bottom of the page there are more links that could get you on track ...

kind regards

[Frinavale]

ahh ...wait Frinny ;) ... was that a question? ...

Yes it was a question (note the question mark) :)
I should have probably just researched it....but was lazy yesterday.

[gits]

yes ... i know and i misunderstood it as a question for whether the OP would use AJAX or not and as it turned out now he isn't at the moment ... so that would explain the behaviour of the browser ... :)

[tusovka]

For some reason I could not post a reply. So if later you see 3 same replies just ignore.


I located the XMLHttpRequest( ) function.

function techPage(A, B, C, D, E, F) {
    var oRequest = new XMLHttpRequest();
    var sURL= \"http://\"+self.location.hostname+E+D+\".php?A=\"+A+\"&B=\"+B+\"&F=\"+F;
    //alert(sURL);
    //document.write(sURL);
    oRequest.open(\"GET\",sURL,false);
    oRequest.setRequestHeader(\"User-Agent\",navigator.userAgent);
    oRequest.send(null)
    if (oRequest.status==200)  {
      return(oRequest.responseText);
      //alert(oRequest.responseText);
    } else {
        alert(\"Error executing XMLHttpRequest call!\");
      }
  }

----

Any suggestions on what my next step could be in finding a solution to my message issue in IE???

[Frinavale]

For some reason I could not post a reply. So if later you see 3 same replies just ignore.

Hehe, yeah I cleaned up your duplicate posts.
The reason your reply wasn't showing up is because your post contained code that the forum filter thought could be dangerous. One way to avoid this problem is to post your code in code tags... but some posts are filtered even with code tags. If it happens again just contact a moderator and they'll fix it for you :)