How do I build a specialized JQuery Timer

I have an asp.net page where two grid views are available showing current stock market price updates. I need to update these two grid views every 20 seconds. So I was thinking of using JQuery to do this job.

What I need is a timer which will fire every 20 seconds, send an ajax request to the servers, bring the order lists from the server using json and then update those two grid views. If a request to the server is still being served 20 seconds after it is fired, then I want the old one to be aborted without causing any trouble.

I already know how to bring objects using json. I just need to figure out how to send a request every 20 seconds and cancel a request if it is still being server for 20 seconds.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Use javascript’s setInterval() to run some code at an interval.

jQuery’s $.ajax() will return the XMLHTTPRequest object that you can abort.

var request;    // Stores XMLHTTPRequest object

setInterval(function() {
                 // if there's a current request, abort
              if(request) request.abort();

                // make ajax request, and assign request to variable
              request = $.ajax({
                     // My ajax request parameters
              });

}, 20000);       // repeat every 20 seconds (20,000 milliseconds)

http://api.jquery.com/jQuery.ajax/

EDIT:

If you ever need to stop the interval from running, you need to assign the interval to a variable, and then clear it whenever you want.

var theInterval = setInterval(function() {...}, 20000);

theInterval.clear();   // To stop the interval from running

Method 2

Use javascript’s

setTimeout("doSomething()",1000);

Method 3

Use jquery.timers-1.0.0.js

and this method will work fine if we use JSON for posting and getting data

function setTimer() {

        $(function () {


                    $.ajax({ url: 'url', //url which is requested
                        type: 'POST',
                        data: json,
                        dataType: 'json',
                        contentType: 'application/json; charset=utf-8',
                        success: function (data) {
                           // do something
                        }

                    })
                });

    }





    function resetTimer() {

        $(function () {

                $.ajax({ url: 'url', //url which is requested
                    type: 'POST',
                    data: json,
                    dataType: 'json',
                    contentType: 'application/json; charset=utf-8',
                    success: function (data) {
                        // do something
                    }

                })
            });

    }

in this the url can be the view where the required result is displayed.

The setTimer() and resetTimer() methods can be used to set the action needed and reset the action according to any trigger like a button press

Method 4

Use icallbackeventhandler with the timer

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0