yii_CGridView_ajax_pagination_and_ajax_sort

本文主要内容：

1， 正常情况下 CGridView 实现 Ajax 分页和排序的原理

2， 分页和排序无法Ajax的情况分析

3， 自定义分页（重写CLinkPager）后如何实现 Ajax 分页和排序

/***

author: php攻城师

http://blog.csdn.net/phpgcs

***/

[php]

<?php

$this->widget('zii.widgets.grid.CGridView', array(

'id'=>'keyword-grid',

'dataProvider'=>$model->search(),

'cssFile'=>false,

'template'=>'{items} {pager} {summary} '、

'pager'=>array('cssFile'=>false)、

'ajaxUpdate'=>true、

'columns'=>array(

array(

'名前'=>'リーダー名',

'値'=>'$data->イベント'、

'ヘッダー'=>'キーワード名',

'headerHtmlOptions'=>array('width'=>'130px'),

)、.... ....

上記のコードは、ページャーがカスタム スタイルを使用することを除いて、通常の CGridView を実装します。 。

そして、ページのソースコードで、関連する部分を見つけてみましょう:

[JavaScript]

[javascript] plaincopyprint を表示しますか?

/* jQuery(関数($) {

jQuery('#keyword-grid a.delete').live('click',function() {

if(!confirm('このデータを削除してもよろしいですか?')) return false; var th=this;

var afterDelete=function(){}; $.fn.yiiGridView.update('キーワードグリッド', {

タイプ:'POST'、

URL:$(this).attr('href')、

成功:関数(データ) {

$.fn.yiiGridView.update('キーワードグリッド');

afterDelete(th,true,data);

}、

エラー:関数(XHR) {

return afterDelete(th,false,XHR); } }

});

は false を返します。 });

jQuery('#keyword-grid').yiiGridView({'ajaxUpdate':['1','keyword-grid'],'ajaxVar':'ajax','pagerClass':'pager','loadingClass ':'grid-view-loading','filterClass':'filters','tableClass':'items','selectableRows':1,'pageVar':'keyword_page'});

});

/*]]>*/

yii が jquery.ba-bbq.js && jquery.yiigridview.js と 2 つのコードを自動的にロードしたことがわかります

段落の 1 つは、データ行を削除する機能を実現するために使用され、ユーザーに削除するかどうかを確認するためのプロンプト ボックスが表示されます。 このセクションは、ajax 更新グリッドにとって最も核心的で重要なセクションであり、ajax のページめくりとソートを実装するコードの部分でもあります。

/*********** 私が境界線です *****************************/

ページングまたは並べ替えをクリックした後に、それが Ajax メソッドではないことが判明した場合 (つまり、アドレス バーに各リクエストの URL が表示されます)

チェックすべき場所が 1 つあります:

ajaxUpdate=>''、このパラメータ

updateSelector=>''、このパラメータ

/*********** 私が境界線です *****************************/

通常の状況では、CLinkPager はニーズを満たすことができないため、書き直す必要があります。

書き換える方法は 3 つあります:

1. CGridView 自体の Pager を無効にし、CGridView の外で自分で作成します

2. CGridView 自身の Pager を無効にし、CGridView ファイルを書き換えて、パブリック関数 renderItems() に独自の Pager を記述します

3. CGridViewのページャーパラメータを設定します。

デフォルトの CLinkPager は次のようになります

ページめくり:

ここで、次のポケベル効果が必要です

アイテム 31 ～ 40、合計 14546

前のページ 1 2 3 4 5 6 7 8 9 10 次のページ

/***

著者: PHP 包囲部門

***/

まず最初の書き換えソリューションを見てみましょう:

CLinkpager を次のように書き換えます:

[php]

$this->widget('CLinkPager', array(

'header'=>th'.($paginationTop->getCurrentPage()*$paginationTop->getPageSize()+1)。

' - '.($paginationTop->getCurrentPage()*$paginationTop->getPageSize()+$paginationTop->getPageSize())。 ' アイテム、合計 '.$paginationTop->getItemCount().' アイテム '、

'ページ' => $paginationTop,

'itemCount'=>$totalItemFoundCount、

'prevPageLabel' => '前のページ'、

'cssFile'=>false、

'nextPageLabel' => '次のページ'、

'フッター'=>'、

));

ページネーションはコントローラーで生成されます

[php]

$paginationTop = new CPagination($totalItemFoundCount);

$paginationTop->pageSize= $pageSize

次に、書き換えた CLinkPager を CGridView の前に置きます。

実行後、ページングが Ajax ではないというバグを発見しました。

Ajax でなくても問題ありません。重要なのは、ページングとソートを併用できないことです。

理由は非常に単純で、ページングは Ajax ではありませんが、ソートは Ajax であるため、2 つのリクエストが送信された後、URL は同じ場所にないため、ページング パラメーターとソート パラメーターは同じ場所になくなります。もちろん、併用することはできません。

解決策: 統合します。

統合 URL ソートとページング、または統合 Ajax ソートとページングのいずれか。

URL は単純です。ajaxUpdate=>false を設定します。

この記事の最初の部分で説明した Ajax ソートの原理を理解していれば、Ajax も簡単です。

Ajax ページングが実行できない理由は、ページングが書き換えられて CGridView の外に配置されているためです。どうすればそのようにできるでしょうか

jQuery('#keyword-grid').yiiGridView({'ajaxUpdate':['1','keyword-grid'],'ajaxVar':'ajax','pagerClass':'pager','loadingClass ':'grid-view-loading','filterClass':'filters','tableClass':'items','selectableRows':1,'pageVar':'keyword_page'});

ajaxUpdate を使用するとき、外部で作成した CLinkPager を引き続き管理しますか?

2 つのパラメータを設定します:

'ajaxUpdate'=>'datalist-grid, yw0',

'Updateselector' = & gt; ポケベル a、thead th a'、

元々、ajaxUpdate のスコープは datalist-gird のみであり、グリッドの外側で書き換えるページング UL にも影響することを伝え、その ID は yw0 です。

updateSelector は、ajaxUpdate アクションをトリガーする html 要素を指定します。また、ページング リンクと並べ替えリンクが含まれていることを確認する必要があります。そうしないと、ajax 並べ替え/ページネーションが成功しません。

2 番目の書き換えソリューションを見てください:

上記の最初の解決策は複雑すぎます。問題の核心はカスタム ClinkPager が CGridView に配置されていないことなので、CGridView を書き換えて配置します。

はい、確かに実現可能です。

[php]

<?php

Yii::import('zii.widgets.grid.CGridView');

クラス EbuCGridView は CGridView を拡張します

{

/**

* グリッド ビューのデータ項目をレンダリングします。

*/

パブリック関数 renderItems()

{

if($this->dataProvider->getItemCount()>0 $this->showTableOnEmpty)

$this->renderCustomerPager();

echo " itemsCssClass}">n";

$this->renderTableHeader(); ob_start();

$this->renderTableBody(); $body=ob_get_clean();

$this->renderTableFooter();

echo $body; // 標準に従って、TFOOT は TBODY の前に出現する必要があります。

エコー " "; $this->renderCustomerPager();

}

それ以外

$this->renderEmptyText(); }

public $paginationTop;

public $totalItemCount;

public $totalItemFoundCount;

パブリック関数 renderCustomerPager()

{

$paginationTop = $this->paginationTop;

$totalItemCount = $this->totalItemCount;

$totalItemFoundCount = $this->totalItemFoundCount;

echo ' ';

$this->widget('CLinkPager', array(

'header'=>'第 '.($paginationTop->getCurrentPage()*$paginationTop->getPageSize()+1)。

' - '.($paginationTop->getCurrentPage()*$paginationTop->getPageSize()+$paginationTop->getPageSize())。

' 条、共 '.$paginationTop->getItemCount().' 条 '、

'ページ' => $paginationTop、

'itemCount'=>$totalItemFoundCount,

'prevPageLabel' => '上一页'、

'cssFile'=>false,

'nextPageLabel' => '次の一页'、

'フッター'=>' '、

));

....

第 3 の案：

前の 2 つの案、諺、都太麻痺、yii 自身の機構を破壊し、その上に半天を置いた。

最も良い方法は、 CGridView の 'pager' を構成することにより、より改良された CLinkPager の項目を実現します。

ただし、場合によっては、第 1、2 の方法を使用する必要があります。

比如我应用的情况:

Coreseek 全文インデックスを使用してデータの id を出力し、さらに id を使用してデータをデータベースに取得し、 CActiveDataProvider を形成し、最後に CGridView を使用して表示します。

我这里の CDbCriteria 如下

[php]

$criteria = 新しい CDbCriteria;

$criteria->join = 'LEFT JOIN site2 AS si** ON t.**=**.domain_hash';

$criteria->addInCondition('t.id', $IDARRAY);

$criteria->select = array("t.id", "t.content", "t.pubtime", "t.url", "t.reply_num", "t.retweet_num", "site_config" .サイト名");

$criteria->order = 'FIND_IN_SET(t.id, "'.join(",", $IDARRAY).'")';

その中の变量 IDARRAY は、正確には coreseek で得られた 1 つの ID 構成の数グループです

如果按照普通の

[php]

$dataProvider = new CActiveDataProvider('TData', array(

'criteria'=>$criteria,

'ページネーション'=>array(

'pageSize'=>10,

)、

));

は私たちの要求を満たしていません。

私たちの分別と順序付けはすべてコアシーク中に完了するため、ここでは CActiveDataProvider を使用して現在の状態 (たとえば、各 10 個の記録) の 10 個の記録が提供されます。

終了。

より良い提案と意図があり、共同体を歓迎します。