Sunday, July 1, 2012

Ajax pagination returns the whole page instead of the requested div

Hello everyone.

I'm trying to do a Twitter style auto- load more when scrolling :

                         <?php if (!$isAjax):?>
  <div id="postList">
  <?php endif;?>
   
  <?php echo $this->element('posts'); ?></div>
   
  <?php if (!$isAjax):?>
  </div>
  <?php endif;?>
   
  <?php if (!$isAjax):?>
  <?php
  echo $this->Html->script('jquery', false);
  $maxPage = $this->Paginator->counter('%pages%');
  ?>
  <script type="text/javascript">
  var lastX = 0;
  var currentX = 0;
  var page = 1;
  $(window).scroll(function () {
  if (page < <?php echo $maxPage;?>) {
  currentX = $(window).scrollTop();
  if (currentX - lastX > 300 * page) {
  lastX = currentX;
  page++;
  $.get('posts/page:' + page, function(data) {
  $('#postList').append(data);
  });
  }
  }
  });
  </script>
  <?php endif;?>
   
  <?php echo $this->Js->writeBuffer(); ?>
This should updates only the div "postList" but it returns the whole page in the view. In my controller, I have public $components = array('RequestHandler'); activated, and $this->set('isAjax', $this->RequestHandler->isAjax()); in my function. What am I doing wrong ? Thanks a lot !

--
Our newest site for the community: CakePHP Video Tutorials http://tv.cakephp.org
Check out the new CakePHP Questions site http://ask.cakephp.org and help others with their CakePHP related questions.
 
 
To unsubscribe from this group, send email to
cake-php+unsubscribe@googlegroups.com For more options, visit this group at http://groups.google.com/group/cake-php

No comments: