之前我们已经简单的学习过了 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]);
}
根据如上可以实现分页无刷新现象