Yii2 中 ActiveForm 和 GridView 使用 Pjax(局部刷新分页)
这是一个如何在 Yii2 的 GridView 和 ActiveForm 扩展中使用 Pjax 的例子。
这个例子使用一个数据库表 "countries" 字段为 id, name。
控制器
PHP Code复制内容到剪贴板
- public function actionIndex()
- {
- $model = new Countries();
- if ($model->load(Yii::$app->request->post()) && $model->save())
- {
- $model = new Countries(); //reset model
- }
- $searchModel = new CountriesSearch();
- $dataProvider = $searchModel->search(Yii::$app->request->queryParams);
- return $this->render('index', [
- 'searchModel' => $searchModel,
- 'dataProvider' => $dataProvider,
- 'model' => $model,
- ]);
- }
视图
index.php
PHP Code复制内容到剪贴板
- <?php
- use yii\helpers\Html;
- use yii\grid\GridView;
- use yii\widgets\Pjax;
- /* @var $this yii\web\View */
- /* @var $searchModel app\models\CountriesSearch */
- /* @var $dataProvider yii\data\ActiveDataProvider */
- $this->title = Yii::t('app', 'Countries');
- $this->params['breadcrumbs'][] = $this->title;
- ?>
- <div class="countries-index">
- <h1><?= Html::encode($this->title) ?></h1>
- <?php // echo $this->render('_search', ['model' => $searchModel]); ?>
- <p>
- <?= Html::a(Yii::t('app', 'Create {modelClass}', [
- 'modelClass' => 'Countries',
- ]), ['create'], ['class' => 'btn btn-success']) ?>
- </p>
- <!-- Render create form -->
- <?= $this->render('_form', [
- 'model' => $model,
- ]) ?>
- <?php Pjax::begin(['id' => 'countries']) ?>
- <?= GridView::widget([
- 'dataProvider' => $dataProvider,
- 'filterModel' => $searchModel,
- 'columns' => [
- ['class' => 'yii\grid\SerialColumn'],
- 'id',
- 'name',
- ['class' => 'yii\grid\ActionColumn'],
- ],
- ]); ?>
- <?php Pjax::end() ?>
- </div>
_form.php
PHP Code复制内容到剪贴板
- <?php
- use yii\helpers\Html;
- use yii\widgets\ActiveForm;
- /* @var $this yii\web\View */
- /* @var $model app\models\Countries */
- /* @var $form yii\widgets\ActiveForm */
- ?>
- <?php
- $this->registerJs(
- '$("document").ready(function(){
- $("#new_country").on("pjax:end", function() {
- $.pjax.reload({container:"#countries"}); //Reload GridView
- });
- });'
- );
- ?>
- <div class="countries-form">
- <?php yii\widgets\Pjax::begin(['id' => 'new_country']) ?>
- <?php $form = ActiveForm::begin(['options' => ['data-pjax' => true ]]); ?>
- <?= $form->field($model, 'name')->textInput(['maxlength' => 200]) ?>
- <div class="form-group">
- <?= Html::submitButton($model->isNewRecord ? Yii::t('app', 'Create') : Yii::t('app', 'Update'), ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
- </div>
- <?php ActiveForm::end(); ?>
- <?php yii\widgets\Pjax::end() ?>
- </div>
1、使用pjax会失败,需要将超时参数,设为0:
JavaScript Code复制内容到剪贴板
- $.pjax({container: '#countries',timeout: 0});
2、使用pjax时需要传递参数:
JavaScript Code复制内容到剪贴板
- $.pjax({container: '#countries',timeout: 0,data:{"type":"1","status":treeNode.id}});
3、使用pjax时,发现每次参数都重复,可以自己拼url,如:
JavaScript Code复制内容到剪贴板
- $.pjax({url: url, container: '#countries',timeout: 0});