Periodic Updater (jQuery Plugin)

Sometimes we have to use permanent ajax requests to update DOM objects. In this case, some javascript libraries may have the feature but jQuery doesn’t have. You can use this plugin to make continous requests in your projects. Three arguments will return in your callback method. Please read “How to use” below.

Version and development

Dependencies
: jQuery 1.3 or higher
Latest Version
: 0.3b

Browser Support

The plugin is tested with the browsers below:

  • Mac OS X
    • Firefox 3.x, 4.x … 10.x
    • Chrome 7.x
    • Opera 10.63
    • Safari 5.x
  • Windows
    • No tests have been made as I don’t have any Windows installation.

Download

Github
: jQuery Periodic Updater on Github
All versions
: Check current or old versions

Demo

The plugin has started with “document.ready() function” when the page was loaded. You can stop or restart the plugin with the buttons below.

Output:

    This demo is working with the following settings

    {
       url: '/demos/json.php',
       interval: 10000,
       method: 'get',
       data:{'userId': 1},
       response: 'json',
    }
    

    How to Use

    1. Include the js files

    First, include JQuery and periodic updater plugin in your code

      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
      <script type="text/javascript" src="updater.js"></script>
    

    2. Available and default options

    These are default options. You can change the url option in your code. You can alter other options as required.

    {
       url: undefined,      // request url
       data: undefined,     // your data send will request
       interval: 3000,      // interval per request
       method: 'post',      // method, you can use get or post
       response: 'json'     // response data type
    }
    

    3. Initialize the plugin

    You have to call the main method under document ready to initialize the jQuery Periodic Updater plugin.

    $(function(){                           // Start document ready
       $.updater({                          // Call the plugin
          url: 'request.php',               // Request URL
          interval: 15000                   // interval time
       },
       function(data, response){            // Callback method..
                                            // your code here..
       });
    });
    

    4. Stop or restart methods/events

    You can use the following methods to stop or restart the requests.

    $(document).trigger('stop.updater');    // Trigger the stop event or
    $.updater.stop();                       // call the stop method.
    
    $(document).trigger('start.updater');   // Trigger the start event or
    $.updater.start();                      // call the start method.

    5. Debug

    Also there is a debug method available for the plugin.

    $.updater.debug();                      // call the debug method.

    If use the debug method on this page you will see the output like that

       Url: /demos/json.php
       Interval: 10000
       Method: get
       Data: Object { userId=1}
       Callback: function()
       Last Request: success
       Requests Continues: true
    

    6. Errors

    If you get error from server you will see ‘Last Request’ line of the debug method’s outputs

      Url: /demos/nofile.php
      Interval: 10000
      Method: get
      Data: Object { userId=1}
      Callback: function()
      Last Request: XMLHttpRequest
      Requests Continues: true

    The debug method will write the object to your browser console. You have to open the console before debugging. For Firefox, you can install the Firebug extension, Chrome, Opera and Safari have developer tools themselves.

    Change Logs

    0.3b

    • status argument removed of debug method
    • performance improvements

    0.2b

    • Added response data type to default settings.
    • Added last request status to error handle and requests continues status to debug method.
    • Started using $.ajax instead of $.get and $.post.

    0.1b

    • Plugin released.