Yii2 中 ActiveForm 和 GridView 使用 Pjax(局部刷新分页)
yii2 2017-06-29 13:35:38

这是一个如何在 Yii2 的 GridView 和 ActiveForm 扩展中使用 Pjax 的例子。

这个例子使用一个数据库表 "countries" 字段为 id, name。

 

控制器

PHP Code复制内容到剪贴板
  1. public function actionIndex()  
  2. {  
  3.     $model = new Countries();  
  4.   
  5.     if ($model->load(Yii::$app->request->post()) && $model->save())  
  6.     {  
  7.         $model = new Countries(); //reset model  
  8.     }  
  9.   
  10.     $searchModel = new CountriesSearch();  
  11.     $dataProvider = $searchModel->search(Yii::$app->request->queryParams);  
  12.   
  13.     return $this->render('index', [  
  14.         'searchModel' => $searchModel,  
  15.         'dataProvider' => $dataProvider,  
  16.         'model' => $model,  
  17.     ]);  
  18. }  

视图

index.php

PHP Code复制内容到剪贴板
  1. <?php  
  2.    
  3. use yii\helpers\Html;  
  4. use yii\grid\GridView;  
  5. use yii\widgets\Pjax;  
  6.    
  7. /* @var $this yii\web\View */  
  8. /* @var $searchModel app\models\CountriesSearch */  
  9. /* @var $dataProvider yii\data\ActiveDataProvider */  
  10.    
  11. $this->title = Yii::t('app''Countries');  
  12. $this->params['breadcrumbs'][] = $this->title;  
  13. ?>  
  14. <div class="countries-index">  
  15.    
  16.     <h1><?= Html::encode($this->title) ?></h1>  
  17.     <?php // echo $this->render('_search', ['model' => $searchModel]); ?>  
  18.    
  19.     <p>  
  20.         <?= Html::a(Yii::t('app''Create {modelClass}', [  
  21.     'modelClass' => 'Countries',  
  22. ]), ['create'], ['class' => 'btn btn-success']) ?>  
  23.     </p>  
  24.    
  25. <!-- Render create form -->      
  26.     <?= $this->render('_form', [  
  27.         'model' => $model,  
  28.     ]) ?>  
  29.    
  30.    
  31. <?php Pjax::begin(['id' => 'countries']) ?>  
  32.     <?= GridView::widget([  
  33.         'dataProvider' => $dataProvider,  
  34.         'filterModel' => $searchModel,  
  35.         'columns' => [  
  36.             ['class' => 'yii\grid\SerialColumn'],  
  37.             'id',  
  38.             'name',  
  39.             ['class' => 'yii\grid\ActionColumn'],  
  40.         ],  
  41.     ]); ?>  
  42. <?php Pjax::end() ?>  
  43. </div>  

_form.php

PHP Code复制内容到剪贴板
  1. <?php  
  2.    
  3. use yii\helpers\Html;  
  4. use yii\widgets\ActiveForm;  
  5.    
  6. /* @var $this yii\web\View */  
  7. /* @var $model app\models\Countries */  
  8. /* @var $form yii\widgets\ActiveForm */  
  9. ?>  
  10.    
  11. <?php  
  12.    
  13. $this->registerJs(  
  14.    '$("document").ready(function(){  
  15.         $("#new_country").on("pjax:end", function() { 
  16.             $.pjax.reload({container:"#countries"});  //Reload GridView 
  17.         }); 
  18.     });'  
  19. );  
  20. ?>  
  21.    
  22. <div class="countries-form">  
  23.    
  24. <?php yii\widgets\Pjax::begin(['id' => 'new_country']) ?>  
  25. <?php $form = ActiveForm::begin(['options' => ['data-pjax' => true ]]); ?>  
  26.    
  27.     <?= $form->field($model'name')->textInput(['maxlength' => 200]) ?>  
  28.    
  29.    
  30.     <div class="form-group">  
  31.         <?= Html::submitButton($model->isNewRecord ? Yii::t('app''Create') : Yii::t('app''Update'), ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>  
  32.     </div>  
  33.    
  34. <?php ActiveForm::end(); ?>  
  35. <?php yii\widgets\Pjax::end() ?>  
  36. </div>  

 

 

1、使用pjax会失败,需要将超时参数,设为0:

JavaScript Code复制内容到剪贴板
  1. $.pjax({container: '#countries',timeout: 0});  

 

2、使用pjax时需要传递参数:

JavaScript Code复制内容到剪贴板
  1. $.pjax({container: '#countries',timeout: 0,data:{"type":"1","status":treeNode.id}});  

 

3、使用pjax时,发现每次参数都重复,可以自己拼url,如:

JavaScript Code复制内容到剪贴板
  1. $.pjax({url: url, container: '#countries',timeout: 0});  

 

 

 

本文来自于:http://www.yoyo88.cn/study/yii2/116.html

下一篇 yii2.0 分页
Powered by yoyo苏ICP备15045725号