CODEWITHSUNDEEP
javascriptjqueryhtmlajax
user1398287
user1398287

Reputation: 5385

loading jquery ajax calls into divs without the page jumping

I'm loading ALOT of ajax calls on a page, some of the ajax calls take longer to load than others and it means that sometimes the top ajax call has loaded when the user has already scrolled down the bottom of the page and so they won't get to see the data (unless they scroll to the top again)

here's my code:

<script type="text/javascript" language="javascript">
$(document).ready(function() {
  $('#stage1').load('myscript.php?data=1234567890');
  $('#stage2').load('myscript.php?data=1234567890');
  $('#stage3').load('myscript.php?data=1234567890');
  $('#stage4').load('myscript.php?data=1234567890');
  $('#stage5').load('myscript.php?data=1234567890');
  $('#stage6').load('myscript.php?data=1234567890');
  $('#stage7').load('myscript.php?data=1234567890');
  $('#stage8').load('myscript.php?data=1234567890');
  $('#stage9').load('myscript.php?data=1234567890');
  $('#stage10').load('myscript.php?data=1234567890');
  $('#stage11').load('myscript.php?data=1234567890');
  $('#stage12').load('myscript.php?data=1234567890');
  $('#stage13').load('myscript.php?data=1234567890');
  $('#stage14').load('myscript.php?data=1234567890');
  $('#stage15').load('myscript.php?data=1234567890');
});
</script>

HTML

<div id='stage1'>
<div id='stage2'>
<div id='stage3'>
<div id='stage4'>
<div id='stage5'>
<div id='stage6'>
<div id='stage7'>
<div id='stage8'>
<div id='stage9'>
<div id='stage10'>
<div id='stage11'>
<div id='stage12'>
<div id='stage13'>
<div id='stage14'>
<div id='stage15'>

How can I make them load always at the bottom of the page? it doesn't matter which order they load in.

Upvotes: 0

Views: 757

Answers (1)

A. Wolff
A. Wolff

Reputation: 74410

If i understand your issue, use load() callback:

$('#stage1').load('myscript.php?data=1234567890',function(){$('body').append(this);});

Do that for all elements or if all elements have same targeted url in load() method, use a class.

Upvotes: 1

Related Questions