Ajax page not getting refreshed in IE

[vjayis]

hi

i have a php page in which i have included few tabs links like

games, news,entertainment etc.,

when i click the tablink an ajax page is loaded below.
In that ajax page several pages(iframes) are loaded inside the tables, such that it contains three tables in a row.
each table contains different pages loaded through iframes,
and an close button is available so that we can close the unwanted tables(containing frames).

"i hav done similar to igoogle drag and drop portion without drag option"

so if we close an table the page name is stored in the database and it is not diaplayed.,

The problem is when i close the tables(page containing iframes) its getting closed and the values are stored correctly in the database., but after that if i click the same tablink the ajaxpage gets loaded along with the closed tables(which i have closed).
i,e the page gets loaded with the old datas without getting the refreshed values from the database.,

it works well in firefox.,

Can anyone help me.,

regards
vijay

[acoder]

The page is probably getting cached.

You'll need to get a unique page, so add something like

"&cache="+(new Date()).getTime()

to the end of the URL.

[vjayis]

The page is probably getting cached.

You'll need to get a unique page, so add something like

"&cache="+(new Date()).getTime()

to the end of the URL.

Hi

i cant understand., i m new to to ajax., where i want to add the code., and with the code do i want to do something.,?

help me to get rid of this.,

[acoder]

Post your current code.

[vjayis]

Post your current code.

Here is my code:

<script type="text/javascript">
 
function ajaxFunction1(action,id,uname,tablename)
{
var xmlHttp;
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    try
      {
      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    catch (e)
      {
      alert("Your browser does not support AJAX!");
      return false;
      }
    }
  }
xmlHttp.onreadystatechange=function()
{ 
 if(xmlHttp.readyState==1)
 {
 
 }
 if(xmlHttp.readyState==4)
 { 
    document.getElementById("ajax1").innerHTML=xmlHttp.responseText;
 }
}
 
xmlHttp.open("GET","includes/ajaxpage.php?action="+action+"&id="+id+"&uname="+uname+"&table="+tablename,true);
xmlHttp.send(null);
 
}
</script>
 

so when i close an table (containing iframe)., four variables are passed to the ajax page and the same page gets loaded without the closed table. the closed table name is stored in the database such that it is not diaplayed.,

very urgent ., help me in this.,

thanks

[vjayis]

Post your current code.

Here is my code:

<script type="text/javascript">
 
function ajaxFunction1(action,id,uname,tablename)
{
var xmlHttp;
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    try
      {
      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    catch (e)
      {
      alert("Your browser does not support AJAX!");
      return false;
      }
    }
  }
xmlHttp.onreadystatechange=function()
{ 
 if(xmlHttp.readyState==1)
 {
 
 }
 if(xmlHttp.readyState==4)
 { 
    document.getElementById("ajax1").innerHTML=xmlHttp.responseText;
 }
}
 
xmlHttp.open("GET","includes/ajaxpage.php?action="+action+"&id="+id+"&uname="+uname+"&table="+tablename,true);
xmlHttp.send(null);
 
}
</script>
 

so when i close an table (containing iframe)., four variables are passed to the ajax page and the same page gets loaded without the closed table. The closed table name is stored in the database such that it is not diaplayed.,

very urgent ., help me in this.,

thanks

[vjayis]

Hi

got the solution.,.

applied the code given by u correctly in the url.,

it gets working well in IE now.,

thanks

[acoder]

Glad you managed to work it out yourself :)

[vjayis]

Hi

i m with the same problem once again.,

i had added the given code by u to all the ajax url's that are contained in my page.,
but still i m having problem.,

when i select an tab(example:games) the tables which comes under the games category are displayed under the tabnames.
Note:each table contains frame in which the particular game is loaded.

if i click on another tab(example:news) before the tab(containing games) gets loaded-> mismatch occurs.,
the titles of the tables gets changed but the contents(frames) didnt get changed.,

and i had added the the code given by u to my page redirecting.,

here is my code.,

 
var dd=(new Date()).getTime();
tabs.open("GET","tabselection.php?tabname="+tab+"&data1="+data1+"&data2="+data2+"&data3="+data3+"&cache="+dd,true);
tabs.send(null);
 
 

any other solution to get rid of this.,

regards
vijay

[acoder]

That's a slightly different problem. You're reusing the same object which is still in use, so when you make another request whilst one is still ongoing, you need to abort the previous request. You can do that by checking that the ajax request object has not completed. If it hasn't, abort using the abort() method.

[hsriat]

if i click on another tab(example:news) before the tab(containing games) gets loaded-> mismatch occurs.,
the titles of the tables gets changed but the contents(frames) didnt get changed.

Apparently, you are changing the name of the tab and then sending the Ajax request. Instead, you need to run the change-name part of code in the onreadystatechange function, after you receive the xmlHttp response.

[vjayis]

sorry to say this.,

i am unable to implement the ideas given by you.,

so could you explain me briefly with some coding.,

here is my full script used to load the another page while selecting another tab.,

<script type="text/javascript">
 
function tabs123(tab,type,data3,data4)
{
try
  {
  tabs=new XMLHttpRequest();
  }
catch (e)
  {
  try
    {
    tabs=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    try
      {
      tabs=new ActiveXObject("Microsoft.XMLHTTP");
      }
    catch (e)
      {
      alert("Your browser does not support AJAX!");
      return false;
      }
    }
  }
def5=document.getElementById("defaulthid").value;
tabs.onreadystatechange=function()
{ 
 if(tabs.readyState==1)
 {
     document.getElementById("tabimage").style.display="block";
 }
if(tabs.readyState==4)
 { 
    document.getElementById("tabimage").style.display="none";
    document.getElementById("tabs").innerHTML=tabs.responseText;
 }
}
var dd=(new Date()).getTime();
tabs.open("GET","tabselection.php?tabname="+tab+"&type="+type+"&data3="+data3+"&data4="+data4+"&cache="+dd,true);
tabs.send(null);
 
}
</script>
 
<a style="cursor:pointer" onClick="tabs123('games','<? echo $tablename;?>','<? echo $data3;?>','<? echo $data4;?>')" >Games</a>
            <a  style="cursor:pointer" onClick="tabs123('news','<? echo $tablename;?>','<? echo $data3;?>','<? echo $data4;?>')" >news</a>
 
<div id="tabs"></div>
 

[acoder]

There are two ways to solve this. One way is to check if the ajax object's readyState is 0 (uninitialized). If it's not, abort the request.

The second way is to just swap the open() and onreadystatechange lines, i.e. place the open() call before the onreadystatechange event handler.

[vjayis]

There are two ways to solve this. One way is to check if the ajax object's readyState is 0 (uninitialized). If it's not, abort the request.

The second way is to just swap the open() and onreadystatechange lines, i.e. place the open() call before the onreadystatechange event handler.

i tried out the second way as u suggested.,

but i also like to know how to implement through first method u r saying.,
i am stuck., how to implement it.,
here i check whether the object's readystate is 0.,

if(xmlHttp.readyState==0)
{
}
 

i dont know what to do within this., to abort the request.,

and if the request is aborted what will happen., the present operation will gets aborted or already running(previous) operation will get aborted??

regards
vijay

[acoder]

i tried out the second way as u suggested.,

I assume that worked then?

but i also like to know how to implement through first method u r saying.,
i am stuck., how to implement it.,

Something like this:

if(xmlHttp.readyState!=0)
{
    xmlHttp.abort();
}
 

and if the request is aborted what will happen., the present operation will gets aborted or already running(previous) operation will get aborted??

There's only one Ajax object, so the previous one will get aborted to allow you to use it for the current request.

[vjayis]

thanks for your guidelines given.,

and i have a another error.,

As i had told already i m having many tabs in the page which contains frames having unique datas.,

and different frames are loaded in that section by selecting the tab.,

it gets loaded.,and after selecting some tab(say second tab) and i m going to another page using a link.,

Note: this link doesnt comes inside the ajax section., it is displayed above that section.,

when i m going to next page using a link,and coming back to this previous page(i,e page containing ajax) using the back button provided by the browser., the frames are not located in to the their own sections., it gets swaped.,

so i want the user to come back to this page by using a link.,

how can i load the page without mismatch.,

do i need the disable the back button functionality of the browser or is there a way to load the datas correctly when returning back.,

regards
vijay

[acoder]

No, don't attempt to disable the back button. You can't reliably anyway.

You can either build in history using the location hash property (there are some history frameworks out there), or use cookies. When an Ajax request is made, set a cookie. When you come back to the page, if the cookie is set, make those requests again.

[vjayis]

No, don't attempt to disable the back button. You can't reliably anyway.

You can either build in history using the location hash property (there are some history frameworks out there), or use cookies. When an Ajax request is made, set a cookie. When you come back to the page, if the cookie is set, make those requests again.

Can u explain me briefly with some examples.,

coz i have not implemented nay of the way u have mentioned.,
thanks

[acoder]

Search for ajax back button and you should find some useful links.