how to ajaxify zend_pagination results (already working with partialoop) using jquery

Question

in the controller i have :

  $paginator = Zend_Paginator::factory($mdlPost->getPosts($this->moduleData->accordion, 'name ASC'));
   if(isset($params['cities'])) {  
          $paginator->setCurrentPageNumber(intval($params['cities']));
            }
$paginator->setItemCountPerPage(4);
$this->view->posts = $paginator;         

in the view's i have some thing like this :

if ($this->posts != null) {?>
  <div id="cities_accord" class="news">
   <?php   echo $this->partialLoop('partials/post-min.phtml', $this->posts); ?>
  </div>   
  <?php   echo $this->paginationControl($this->posts,
                                'Sliding',
                                'public/pagination_cont.phtml'); 
}

the partial/post-min.phtml

<?php 
$color = array(1=>'spring',2=>'summer',3=>'autumn',4=>'winter');
?>

<div id='<?php echo $color[$this->partialCounter] ?>' class="accordion_post">
<?php
$link = Digitalus_Uri::get(false, false, array('openCity' =>      
  $this->id));//$color[$this->partialCounter]));
?>

<h1 class="accordion_post_title"><?php echo $this->title ?></h1>

<p><?php echo $this->teaser ?> <a href="<?php echo $link;?>"><i>read more</i></a></p>
</div>

the pagination_cont.phtml taken from this link zend ( http://framework.zend.com/manual/en/zend.paginator.usage.html ) will show links that will pass params to the controller to fetch the corresponding whole page which is working alright for now

but i want to change this so that i will be able ajaxify the returned ( i.e. only a single paginated value rather than reloading the whole page ) results how can i do that using jquery and what should i change ..

** EDIT: it would be nice to have a fail-save ,if possible, for browsers(users) that disabled javascript to see the same thing by reloading the page (i.e. keeping the current status for if(javascript_not_enabled ))**

Answer 1

GOT IT and big Thanks to @Phil Brown :

in the controller int() change the response type to json

  class NewsController extends Zend_Controller_Action

  {

      public function init()

      {

          $contextSwitch = $this->_helper->getHelper('contextSwitch');

          $contextSwitch->addActionContext('list', 'JSON')

                        ->initContext();

      }



      // ...

  }


public listAtcion() {

  //  .............

  $paginator = Zend_Paginator::factory($mdlPost->getPosts($this->moduleData->accordion, 'name ASC'));
   if(isset($params['cities'])) {  
         $paginator->setCurrentPageNumber(intval($params['cities']));
         }
  $paginator->setItemCountPerPage(4);

  $post = array();
  foreach($paginator as $post ) {
      $post[] = $post;
  }

  $this->view->post = $paginator; 

  #TODO //add a check here for non-ajax requests (#improvment)
    $this->view->posts = $paginator;     

}

in one of the views (most probably in the pagination_cont.phtml) on the pagination controller add the ajax links

 <?= $this->ajaxLink (
                 $this->url('cities'=>$this->page_num),array('id'=>'div_id','complete'=>'js_method(json_data)','method'=>post) ,array('format'=>'JSON'));

and add a JavaScript function of js_method(json_data) to modify the div with id = 'div_id' with a json data

  function js_method(json_data) { 
    var content = parse.JSON(json_data);
     $('#div_id').html(''); 
    //fill it with the reposnse content  some thing like  $('#div_id').append(content); 
  }