A better way to postback or refresh on a timer

A better way to postback or refresh on a timer

  
There are a couple of posts out there that show how to have a page do a postback or refresh using a JavaScript timer. I've used these techniques for years with no problems. In general, they use the following tricks:

* A button hidden using "display: none" CSS that points to a Screen action to do a refresh or perform some other action.
* JavaScript with a "setInterval" call that calls the "click()" method of the button.

This works great. But I recently found a few issues with it. They all come back to the fact that you are effectively CLICKING something on the sceen. That takes the focus way from something else. I have almost always seen this used on a read-only screen or in a manner that the input areas were getting refresh anyways.

Recently I made a screen where the "refresh" postback actually does not refresh anything. And what was happening was that the "click" to the button was messing up the user's input, specifically it made the "Chosen" dropdown collapse again as if you had clicked outside of it. Yikes!

The fix is simple. Instead of calling the "click()" method of the button in your time, set a variable equal to the "onclick" function then run it.

So, here is the comparison (assume your hidden button is named "Refresh"):

OLD WAY

<script type='text/javascript'>
function RefreshResults(id)
{
    document.getElementById('" + Refresh.Id + "').click();
    return false;
}
 
var intervalId = setInterval('RefreshResults()', 5000);
</script>
NEW IMPROVED WAY

<script type='text/javascript'>
function RefreshResults(id)
{
    var refreshFunction = document.getElementById('" + Refresh.Id + "').onclick;
    refreshFunction();
    return false;
}
 
var intervalId = setInterval('RefreshResults()', 5000);
</script>

Hope this helps!

J.Ja
Hi Justin,

I'm new in the web+OS world so this could be a dumb question.

So, is there a way to get a reference to an OS action in JavaScript without using this subterfuge?

Because it seems to me that you're using the onClick action as a temporary placeholder to pass the function reference from OS to Javascript and then set it on the timer.

Cheers,
Daniel
Daniel -

OS actions are server side. There's no way to directly call a server-side action from any language/framework, other than using a Web Service. So yes, you could make a Web Service exposing the action, but most cases that does not make sense. So the standard technique is to make a hidden button/link and call click() on it.

J.Ja
Hi Justin,

I know the actions are server side :)
What I meant was this:
- In an example I have I set the OnChange action on a radio button
- the platform generates some code in that input's "onclick" property that uses Ajax to get the server to run that action
-- In my case it looks something like this: "OsAjax(arguments[0] || window.event,<huge string identifying the input>,'Change','__OSVSTATE,','');"
- like you showed above, I can use JavaScript to get a reference to that code, something like:
var myOnChangeFunction = document.getElementById('" + myInput.Id + "').onclick;
- and then I can call it, set it on a timer, etc.

So in the end I am calling a server action from JavaScript but in a very roundabout way. What I wanted to know really was if there's an easier way to achieve this, but it seems the answer is no, right? :)

Thanks,
Daniel
Daniel -

That's correct, there is no direct way to get that *that I am aware of*.

J.Ja
Thanks fantastic solution... works very well in a expression.
what his html should be... can u provide both html jquery