Question

I am a beginner at Jquery. What i want is to display the data using AJAX in a step by step manner. So let say if in my database there is a table “DATA” with a field name “info” having multiple rows as a data

info

1
2
3
4
5

Now i want to display all the five rows but after a certain delay of time let say after a second.

So i want to use Jquery with AJAX to retrieve data from mySQL table and display each row after a second.

Please provide an example for solving this problem. Thanks in Advance…

Answer 1

You can use the delay() method. Let’s suppose you have fetched records through ajax and use the fadeIn animation, you can go about something like this:

$('<div>').html(AjaxResponse).addClass('test').hide();
$('div.test').slideUp(300).delay(1000).fadeIn(400);

Or use setTimeout instead:

setTimeout(function() { $('div.test').slideUp(300).delay(1000).fadeIn(400); }, 5000);