refresh content of a jquery ui dialog

ciprian picture ciprian · Sep 17, 2010 · Viewed 9.7k times · Source

i managed to to get this script. It's refreshing the div of the dialog window:

function getRandom() {
$("#category_dialog").load("<?php echo $category; ?>", '', callback);

}

function callback() {
    $("#category_dialog").show("fast");
    setTimeout("getRandom();", 10000);
}

$(document).ready(getRandom);

everything works fine. div gets refreshed every 10 seconds. But i have some doubts about this method. 1. since is doing a refresh at any 10 seconds will slow down the speed of the borwser or something like this? 2. I would like to make it refresh more faster at every 3 seconds could anything bad happen?

I would prefer to make somehow a link that will refresh the content onclick -- but i couldn't find any good examples. Can someone help me out with this. So i want the category_dialog div be loaded using load.() but with onclick call -- and display then whats new. Thanks!


With Kissaki help i managed to make a simple function that will make me a refresh link :) here's the sample:

$(function() {
  $("#refresh").click(function() {
     $("#category_dialog").load("<?php echo $category; ?>")
  })
})

Answer

Kissaki picture Kissaki · Sep 17, 2010

If you want to decrease the refresh interval you only have to consider performance: bandwidth, server load and client load.

Client load shouldn’t be a problem, if it’s not a useless refresh in the background. You could for example only refresh if the window has focus to reduce pulling useless, never seen data.

As the div is shown once and you call the show function each time you refresh (while it’s still shown, as it was never hidden) you may remove that call. I’m not quite sure how jQuery implemented it and how much of a performance gain you can get here, but it’s a useless call after the first call anyway.

You could also probably use this in the callback function, as you’re using the load function. You’d have to check though.

Also, you don’t need to pass an empty string to the load function. That data parameter is optional.

And as I see no content update, you probably dropped that from the code before pasting here?

For the onclick jQuery provides the click() function http://api.jquery.com/click/

$("#category_dialog").click(function(event){
  //refresh code here
});