SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    Patience... bronze trophy solidcodes's Avatar
    Join Date
    Jul 2006
    Location
    Philippines
    Posts
    936
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)

    Cool jQuery AJAX samples?

    Hi guys,

    Can you provide complete codes/instructions for jQuery AJAX samples?

    A link or url to a tutorial or samples regarding jQuery AJAX is much appreciated.

    The jQuery site itself on the AJAX category, some samples codes are not really complete.
    Sorry I'm noob to jQuery AJAX so I need your guidance.

    Thanks in advanced.
    Quality codes are optimized and tested...
    Click here for inspiration..

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Hi solidcodes,

    First, a word about AJAX.

    AJAX stands for Asynchronous JavaScript + XML.
    It is not a technology in its own right, rather a term coined in 2005 by Jesse James Garrett, that describes a "new" approach to using a number of existing technologies together.
    These technologies include: HTML or XHTML, CSS, JavaScript, The DOM, and most importantly the XMLHttpRequest object.

    When these technologies are combined, web applications are able to make quick, incremental updates to the user interface without reloading the entire browser page. This makes web applications faster and more responsive to user actions.

    Although the 'X' in AJAX stands for XML, JSON is used more than XML nowadays because of its many advantages such as being lighter and a part of JavaScript. However, both JSON and XML are still used for packaging information in AJAX model.

    Source: https://developer.mozilla.org/en/docs/AJAX

    So, what does an AJAX call look like?
    Traditional Ajax calls usually take on the following form:

    Code JavaScript:
    function httpRequest(id) {
      if (window.XMLHttpRequest) { // code for IE7+, FF, Chrome, Opera, Safari
        http=new XMLHttpRequest();
      }
      else { // code for IE6, IE5
        http=new ActiveXObject("Microsoft.XMLHTTP");
      }
      http.onreadystatechange=function() {
        if (http.readyState==4 && http.status==200) {
          response = http.responseText;
          // do something with response
        }
      }
      dest="servlet.php?id=" + id;
      http.open("GET", dest);
      http.send();
    }

    If your web application only uses one Ajax call, it’s not that big of a deal to implement. The problem occurs, however, when your web application leverages lots of Ajax calls and you try to break the code apart to make it reusable.

    Compare this with an AJAX call in jQuery:

    Code JavaScript:
    $.Ajax({
      type: "POST",
      url: "some.php",
      data: "name=John&location=Boston",
      success: function(msg){
        alert( "Data Saved: " + msg );
      }
    });

    jQuery has put all of the properties of Ajax into one simple API. You can control everything including the url, cache, success function, data type, and even synchronization, all from one neat declaration.

    Source: http://sixrevisions.com/javascript/t...ery-with-ajax/

    As further reading I would recommend the following:

    http://net.tutsplus.com/tutorials/ja...s-with-jquery/
    http://tutorialzine.com/2009/09/simp...ebsite-jquery/
    http://developers-blog.org/blog/de/2...19/jQuery-Ajax
    http://www.sitepoint.com/ajax-jquery/

    I hope that helps.

  3. #3
    Patience... bronze trophy solidcodes's Avatar
    Join Date
    Jul 2006
    Location
    Philippines
    Posts
    936
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    @pullo

    thanks dude.
    Quality codes are optimized and tested...
    Click here for inspiration..


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •