Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Feb 2009
    Posts
    21
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question How to detect when the AJAX call is returned?

    I have a Java web application in which I use jQuery to make AJAX call to the server for data. I receive XML document. I get the data from XML document and append the values to HTML tags. Right before the AJAX call I display a loading image. When or where should I stop the loading image? How can I know when HTML tags are filled up? Thanks.

  • #2
    Senior Coder ckeyrouz's Avatar
    Join Date
    Jun 2009
    Location
    Montreal, Canada
    Posts
    1,044
    Thanks
    5
    Thanked 179 Times in 179 Posts
    If I got you well:

    Before you make an ajax call, you display an animated pic (rotates for example) to show the user that you are loading data and once you finish you need to hide it.

    If this is the case then you should do the following (am only describing process here, but if you want code change post yours so we can help more):
    1. Before the call make an ajax object (var ajaxCall = new YourFunction());
    2. Assign a method onreadystate as follows:
      ajaxCall.onreadystatechange = function()
      {
      if(ajaxCall.readyState == 4)//this means that the data is loaded
      {
      //here do what you want to do, fill the html.
      //here after the html is filled and all your steps are done hide the rotating image
      }
      }
    Software and cathedrals are much the same - first we build them, then we pray.

  • #3
    New Coder
    Join Date
    Feb 2009
    Posts
    21
    Thanks
    0
    Thanked 0 Times in 0 Posts
    That's exactly what I try to do, but since I am very new to AJAX and jQuery I am still not sure what goes where!! So here is my code:
    /*
    function loadCarInfo(carId){

    // show the loading image.
    document.getElementById("loading").style.display = 'block';
    var params = {
    carId : carId

    };

    var carSectionSubmitURL = $("input[name='carSectionSubmitURL']").attr('value');


    $.post(
    carSectionSubmitURL,
    params,
    function me(data)
    {

    var model = $("model", data).text();
    $("#ModelId").append(model);


    var color = $("color", data).text();
    $("#ColorId").append(color);
    .
    .
    .

    });

    }
    */

    Thanks.


  •  

    Posting Permissions

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