Yii 使用pjax

以前咱們已經簡單的學習過了pjax：https://www.wj0511.com/site/d...，今天咱們來學習下在Yii框架中使用pjax，Yii自帶了pjax，使用起來十分的方便

一：簡單實現pjax

view：

<?php
use yii\widgets\Pjax;
use yii\bootstrap\Html;
?>
<?php Pjax::begin([
    'enablePushState' => false,//更新數據保持url不變
    'timeout' =>5000//超時時間
]); ?>
<?= Html::a("點擊事件", ['pjax/pjax'], ['class' => 'btn btn-lg btn-primary']) ?>
<h1>刷新的時間爲: <?= $time ?></h1>
<?php Pjax::end(); ?>

controller:

public function actionPjax()
{
return $this->render('pjax', ['time' => date('Y-m-d H:i:s')]);
}

根據如上代碼能夠實現：

當點擊點擊事件按鈕時，刷新的時間數據發生變化，頁面不會進行刷新

二：form表單提交數據pjax實現

view：

<?php
use yii\widgets\Pjax;
use yii\bootstrap\Html;
?>
<?php Pjax::begin([
    'enablePushState' => false,//更新數據保持url不變
    'timeout' =>5000//超時時間
]); ?>
<?=Html::beginForm(
        ['pjax/form-pjax'],//from表單提交地址
        'post',//提交方式
        ['data-pjax' => '']//使用pjax形式提交數據
)?>
<?=Html::textInput('data')?>   <!--輸入框-->
<?=Html::submitButton('按鈕')?>  <!--按鈕-->
<?= Html::endForm()?>
<h2>輸入的數據爲：<?= $data ?></h2>
<?php Pjax::end();?>

controller:

public function actionFormPjax()
{
    $data = Yii::$app->request->post('data', '');
    return $this->render('form-pjax', [
        'data' => $data
    ]);
}

根據如上代碼能夠實現：

當點擊按鈕時，輸入的數據根據你輸入的數據發生變化，頁面不會進行刷新

三：pjax+GridView實現分頁操做

view：

<?php
use yii\widgets\Pjax;
use yii\grid\GridView;
?>
<?php Pjax::begin([
        'enablePushState' => false,//更新數據保持url不變
        'timeout' =>5000//超時時間
]); ?>
<?= GridView::widget([
    'dataProvider' => $dataProvider,
])?>
<?php Pjax::end();?>

controller:

public function actionPagePjax()
{
    $model = Area::find();//查詢數據
    $dataProvider = new ActiveDataProvider([
        'query' => $model,
        'pagination' => [
            'pageSize' => 10,//設置每頁顯示數
        ],
    ]);
    return $this->render('page-pjax', [
        'dataProvider' => $dataProvider
    ]);
}

根據如上能夠實現分頁無刷新現象