Question

I am trying to wirte a refresh condition if the jquery dialogs are not open. Need fresh set of eyes as it does not seem to work. Code looks like that:

if(!$('#add_note-dialog').dialog("isOpen")) { 
    setTimeout(function() { location.reload() }, 3000);
}

The setTimeout function by itself works perectly, when I check the condition with firebug console, it shows proper status, but when I put it in <script> … it simply does not work or when I remove the “!” condition, it refreshes all the time even when the dialog is closed.

Any ideas?

Answer 1

The code in your question basically amounts to:

• If the dialog is not open:
  • Schedule a page refresh in 3 seconds.

I think you’re looking for:

• Every 3 seconds:
  • If the dialog is not open:
    • Refresh the page.

Or maybe even:

• Every 3 seconds since page load or since the dialog was last closed:
  • If the dialog is not open:
    • Refresh the page.

The first case can be implemented with setInterval():

window.setInterval(function() {
    if (!$("#add_note-dialog").dialog("isOpen")) { 
        window.location.reload();
    }
}, 3000);

The second case is a little trickier, as it requires binding to the dialogopen and dialogclose events, and keeping track of the timer id, e.g. with data(). We also only need a one-shot timer since it will either fire and refresh the page, or be canceled, so setTimeout() will suffice:

$(document).ready(function() {
    $("#add_note-dialog")
        // Set initial timer.
        .data("refreshTimer", window.setTimeout(window.location.reload, 3000))
        .dialog({
            /*
             * Your dialog options,
             */
            open: function() {
                // Dialog open, cancel current timer.
                window.clearTimeout($(this).data("refreshTimer"));
            },
            close: function() {
                // Dialog closed, restart timer.
                $(this).data("refreshTimer",
                    window.setTimeout(window.location.reload, 3000));
            }
        });
});