2012-12-24 104 views
1

enter image description here如何在Zend框架

過濾的視圖部分我已經在Zend的視圖中,我們有如下形式提交進入和底部,我們列出了前面的條目。當我們點擊搜索按鈕時,我已經應用了搜索功能並且工作正常。現在我想要的是使用getJSON事件在keyup事件上應用搜索,以便我們可以即時搜索內容。

我添加了兩個條件用於搜索...使用搜索按鈕單擊。

if($req->isPost()) { 

     { 
      //$ajaxPostedData = $req->getPost(); 
     $ajaxPostedData = $req->getParams(); 
     //echo $ajaxPostedData['search_term']; 
     $select->where("ma_heading like '%".$ajaxPostedData['search_term']."%'");  
     //$select->where($val) 
     //echo $select->__toString();die; 
     //print_r($data = $db_model->fetchAll($select)); 
     //die; 
     //echo $select->__toString(); 

     return $data = $db_model->fetchAll($select); 

     # Paging section 
     $paginator = Zend_Paginator::factory($data); 
     $paginator->setItemCountPerPage(PAGING_RESULT_PER_PAGE); 
     $paginator->setCurrentPageNumber($page); 
     $paginator->setPageRange(PAGING_PAGES_RANGE_PER_PAGE); 
     $this->view->data = $paginator; 
      //$this->_helper->P($ajaxPostedData);die; 
      // 


    } 

和keyup事件

if($req->isXmlHttpRequest()) 
     { 
      //$ajaxPostedData = $req->getPost(); 
     $ajaxPostedData = $req->getParams(); 
     //echo $ajaxPostedData['search_term']; 
     $select->where("ma_heading like '%".$ajaxPostedData['search_term']."%'");  
     //$select->where($val) 
     //echo $select->__toString();die; 
     //print_r($data = $db_model->fetchAll($select)); 
     //die; 
     //echo $select->__toString(); 

     return $data = $db_model->fetchAll($select); 

     # Paging section 
     $paginator = Zend_Paginator::factory($data); 
     $paginator->setItemCountPerPage(PAGING_RESULT_PER_PAGE); 
     $paginator->setCurrentPageNumber($page); 
     $paginator->setPageRange(PAGING_PAGES_RANGE_PER_PAGE); 
     $this->view->data = $paginator; 
      //$this->_helper->P($ajaxPostedData);die; 
      // 
     } 

但內容不是動態替換,當我們正在尋找在KEYUP內容。

請幫我,我怎麼能在zend中應用keyup搜索。

這是我已經習慣了發送請求

jQuery('#txt_heading_filer').keyup(function() { 
     var heading = jQuery('#txt_heading_filer').val(); 

     $.getJSON('admin/admin/announcements/search_term/'+heading, function() {    

     }); 
    }); 

這是需要在搜索刷新

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="top-table-bg"> 
     <tr> 
      <th width="" align="left"><?php echo $obj_trans->_('heading'); ?></th> 
      <th width="20%" align="left"><?php echo $obj_trans->_('expiry date'); ?></th> 
      <th width="10%" align="center"><?php echo $obj_trans->_('publish/unpublish'); ?></th> 
      <th width="10%" align="center"><?php echo $obj_trans->_('action'); ?></th> 
     </tr> 
     <?php 
     foreach($data_arr as $key => $data) { ?> 
     <tr> 
      <td align="left" class="name" ><span><?php echo $data[PREFIX_MASTER_ANNOUNCEMENTS . 'heading']; ?></span></td> 
      <td align="left" class="name"> 
      <?php echo (!empty($data[PREFIX_MASTER_ANNOUNCEMENTS . 'expiry_date'])) ? date("j", strtotime($data[PREFIX_MASTER_ANNOUNCEMENTS . 'expiry_date'])).'<sup>'.date("S", strtotime($data[PREFIX_MASTER_ANNOUNCEMENTS . 'expiry_date'])).'</sup> '.date("M, Y", strtotime($data[PREFIX_MASTER_ANNOUNCEMENTS . 'expiry_date'])) : "N/A"; ?> 
      </td> 
      <td align="center"> 
      <?php Admin_View_Helper_GeneralHelper::status_icon($data[PREFIX_MASTER_ANNOUNCEMENTS . 'status']); ?></td> 
      <td align="center"> 
      <a href="javascript:;" class="info_tooltip update_data" title="Edit" rel="<?php echo $data[PREFIX_MASTER_ANNOUNCEMENTS . 'id']; ?>" id="link_edit"><?php echo $this->img("img/admin/icons/edit.png", array('id' => 'icon_edit')) ?></a> 

      <a href="<?php echo $this->url(array('controller' => 'admin', 'action' => 'announcements', 'do' => 'delete', 'item' => $data[PREFIX_MASTER_ANNOUNCEMENTS . 'id'])); ?>" class="info_tooltip delete_data" title="Delete" rel="<?php echo $data[PREFIX_MASTER_ANNOUNCEMENTS . 'id']; ?>" id=""><?php echo $this->img("img/admin/icons/delete.png", array('id' => 'icon_delete')) ?></a> 
      </td> 
     </tr> 
     <?php } ?> 

     </table> 
+0

你能告訴我們你的相關'.phtml'和腳本 –

+0

@NandakumarV我添加了jQuery和view.ptml內容....請分享你的思緒之中 –

+0

在頁面頂部有輸入數據的表單。用於輸入數據和搜索的代碼是否在同一個操作中? –

回答

2

首先表,你必須把表中一個div的jQuery腳本用一個id

<div id='search-result-table'> 
    <table width="100%" border="0" cellspacing="0" cellpadding="0" class="top-table-bg"> 
     <!-- rows here --> 
    </table> 
</div> 

然後在js函數,調用Ajax和更換內容我n與響應的div

var heading = jQuery('#txt_heading_filer').val(); 
var url = 'admin/admin/announcements/search_term/'+heading; 
$.get(url, function(data) { 
    $('#search-result-table').html(data.result); 
}); 

然後準備結果。不需要if($req->isPost())條件。你必須打電話給所有類型的請求paginator。

if($req->isXmlHttpRequest()) 
{ 
    $this->_helper->viewRenderer->setNoRender(); //Disable view 
    $this->_helper->layout->disableLayout(); //Disable layout 
    $html = $this->view->render('searchresult.phtml'); //Create a new view file in the script location and put the result (same code as in the view page) in it 
    echo Zend_Json::encode(array('result'=>$html));  //Get the result and encode it 
} 

searchresult.phtml

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="top-table-bg"> 
    <!-- rows here --> 
</table> 
+0

那麼分頁將如何在列表中工作。 –

+0

你必須把分頁放在div'search-result-table'和'searchresult.phtml'中。所以分頁視圖也會隨着列表一起更新。 –

+0

當然,我會給這個嘗試。唯一的問題是關於分頁,因爲分頁會將其重定向到相同的控制器 –