How to send a variable from ajax success to a template?

Question

Is it possible reload a page without refresh (silently) ? Here is an example where page reload automatically. But you can easily see that the page is refreshing after certain time interval. I don't like this where end user is getting such experience. I want that the page reload but without refreshing. End user should not feel that page is refreshing. Is it possible using simple html? or jquery?

I don't want <META HTTP-EQUIV="refresh" CONTENT="5"> or setTimeout of jquery because it refreshes the page while reloading?

Answer 1

You must perform Ajax requests at set intervals. This topic is discussed here: How to fire AJAX request Periodically?

Answer 2

Don't reload the whole page. Just use ajax to reload the components that needs to be updated. jQuery is perfect for that.

Answer 3

Use a setInterval with an ajax request. I'll update in 1 min with the script.

var divid = 'yourDivsId'

function createRequestObject() 
{
  var obj;
  var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer"){
    obj = new ActiveXObject("Microsoft.XMLHTTP");
  }else{
    obj = new XMLHttpRequest();
  }
  return obj;
}

function sendReq(req) 
{   
  http.open('get', req);
  http.onreadystatechange = handleResponse;
  http.send(null);
}

function handleResponse() 
{   
  if (http.readyState == 4)
  {
    var response = http.responseText;
    document.getElementById(divid).innerHTML=response;
  }
}


var http = createRequestObject();
setInterval('yourUrl', 30000); //or whatever time you want.

Should do the trick.