遵循此 Wiki Yii 2.0:ActiveForm 上的 Pjax和 GridView - Yii2
我曾尝试使用我的 gridview 在不重新加载页面的情况下在 Ajax 上进行更新,但未能成功.
我的_form.php代码
registerJs('$("文档").ready(function(){$("#new_medicine").on("pjax:end", function() {$.pjax.reload({容器:"#medicine"});//重新加载GridView});});');?><?php使用 yiihelpersHtml;使用 yiiwidgetsActiveForm;使用kartikgridGridView;//使用yiigridGridview;使用 yiidataActiveDataProvider;/* @var $this yiiwebView *//* @var $model appmodelsMedicine *//* @var $form yiiwidgetsActiveForm */?><!-- <div class="row"><div class="col-lg-6 col-lg-offset-3">--><div class="medicine-form"><?php yiiwidgetsPjax::begin(['id' => 'new_medicine']) ?><?php $form = ActiveForm::begin(['options' => ['data-pjax' => true ]]);?><?= $form->field($model, 'medicine_id')->textInput(['maxlength' => 10]) ?><?= $form->field($model, 'medicine_name')->textInput(['maxlength' => 50]) ?><div class="form-group"><?= Html::submitButton($model->isNewRecord ?'Create' : 'Update', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?><?= Html::submitButton($model->isNewRecord ? 'Save & New' : '',$option=['class' => $model->isNewRecord ? 'btn btn-success' :'btn btn-primary','name'=>'save_and_new']) ?>
<?php ActiveForm::end();?><?php yiiwidgetsPjax::end() ?>
控制器中的代码
公共函数actionIndex(){$model = new Medicine();if ($model->load(Yii::$app->request->post()) && $model->save()){$model = new Medicine();//重置模型}$searchModel = new MedicineSearch();$dataProvider = $searchModel->search(Yii::$app->request->queryParams);返回 $this->render('index', ['搜索模型' =>$搜索模型,'数据提供者' =>$数据提供者,'模型' =>$模型,]);}
index.php 中的代码
title = '药物';$this->params['breadcrumbs'][] = $this->title;?><div class="medicine-index"><h1><?= Html::encode($this->title) ?></h1><?php//echo $this->render('_search', ['model' => $searchModel]);?><p><?= Html::a('Create Medicine', ['create'], ['class' => 'btn btn-success']) ?></p><?php yiiwidgetsPjax::begin(['id' => 'medicine']);?><?= GridView::widget(['数据提供者' =>$数据提供者,'过滤器模型' =>$搜索模型,'列' =>[['类' =>'yiigridSerialColumn'],'ID','medicine_id','药物名称',['类' =>'yiigridActionColumn'],],]);?><?php yiiwidgetsPjax::end();?>
我想我已经非常仔细地遵循了说明,但肯定我遗漏了一些东西,因为网格视图没有显示在没有重新加载页面的情况下添加的新记录.
任何帮助将不胜感激.谢谢.
尝试解释如何将其作为一个小部件;这是一个通用的解决方案,如有问题请联系我:
控制器(@your-alias/controllers/yourController):
<代码>...公共函数 actionManage($param=''){$model = new YourModel();if (Yii::$app->request->isPjax && $model->load(Yii::$app->request->post()) && $model->;保存()){$model = new YourModel();//重置模型}$model->paramId = $param;$queryParams = Yii::$app->request->getQueryParams();$queryParams['YourModelSearch']['param'] = $param;$searchModel = new YourModelSearch();$dataProvider = $searchModel->search($queryParams);return $this->renderAjax('@your-alias/widgets/views/index', ['搜索模型' =>$搜索模型,'数据提供者' =>$数据提供者,'模型' =>$模型,]);} ...
小部件(@your-alias/widgets/)[表单,视图]:
_form:
use yiihelpersHtml;使用 yiiwidgetsActiveForm;使用 yiiwidgetsPjax;/*** @var yiiwebView $this* @var yourModule/models/YourModel $model* @var yiiwidgetsActiveForm $form*/?><?php$js = <<<JS//获取表单id并设置事件$('form#{$model->formName()}').on('beforeSubmit', function(e) {var $form = $(this);//在这里做什么,看到参数 $form?是表单的 jQuery 元素console.log($form);console.log("MODEL CODE = " + $("#yourmodel-code").val());}).on('提交', 函数(e){e.preventDefault();});JS;//$this->registerJs($js);$this->registerJs('$("#new-your-model").on("pjax:end", function() {commonLib.divAction("#div_new_model", "隐藏");//隐藏表单$.pjax.reload({容器:"#models"});//重新加载GridView});', yiiwebView::POS_READY);?><div class="model-form"><?php Pjax::begin(['id' => 'new-model', 'timeout' => false, 'enablePushState' => false]) ?><?php $form = ActiveForm::begin(['id' =>$model->formName(),//'方法' =>'邮政','动作' =>['/module/controller/manage?param='.$model->code],'选项' =>['数据-pjax' =>真的 ],//'布局' =>'默认',]);?><?= $form->field($model, 'code')->textInput(['maxlength' => 255]) ?>...<div class="form-group"><?= Html::submitButton($model->isNewRecord ?'Create' : 'Update', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?><?php ActiveForm::end();?><?php yiiwidgetsPjax::end() ?>
索引视图(网格视图):
use yiihelpersHtml;使用 yiigridGridView;使用 yiiwidgetsPjax;/*** @var yiiwebView $this* @var yiidataActiveDataProvider $dataProvider* @var yourModulemodelssearchYourModelSearch $searchModel*/?><div class="model-index"><!--h1><!--?= Html::encode($this->title) ?></h1--><?php//echo $this->render('_search', ['model' => $searchModel]);?><p><?= Html::button(Yii::t('bp', 'Add ...'), ['类' =>'btn btn-成功','onclick'=>'js:commonLib.divAction("#div_new_model", "show")'])?></p><div id="div_new_model" style="display:none"><?= Html::button(Yii::t('common', 'Cancel'), ['类' =>'btn btn-成功','onclick'=>'js:commonLib.divAction("#div_new_model", "隐藏")'])?><!-- 渲染创建表单--><?= $this->render('_formModel', ['模型' =>$模型,]) ?><?php Pjax::begin(['id' => 'models', 'timeout' => false, 'enablePushState' => false]) ?><?= GridView::widget(['数据提供者' =>$数据提供者,'过滤器模型' =>$搜索模型,'列' =>[['类' =>'yiigridSerialColumn'],...['类' =>'yiigridActionColumn'],],]);?><?php Pjax::end() ?>
小部件调用(在视图中):
echo @your-aliaswidgetsYourWidget::widget(['参数' =>$model->param,]);
Following this Wiki Yii 2.0: Pjax on ActiveForm and GridView - Yii2
I have tried to use my gridview to update on Ajax without page-reload, but couldn't succeed.
code of my _form.php
<?php
$this->registerJs(
'$("document").ready(function(){
$("#new_medicine").on("pjax:end", function() {
$.pjax.reload({container:"#medicine"}); //Reload GridView
});
});'
);
?>
<?php
use yiihelpersHtml;
use yiiwidgetsActiveForm;
use kartikgridGridView;
//use yiigridGridview;
use yiidataActiveDataProvider;
/* @var $this yiiwebView */
/* @var $model appmodelsMedicine */
/* @var $form yiiwidgetsActiveForm */
?>
<!-- <div class="row">
<div class="col-lg-6 col-lg-offset-3"> -->
<div class="medicine-form">
<?php yiiwidgetsPjax::begin(['id' => 'new_medicine']) ?>
<?php $form = ActiveForm::begin(['options' => ['data-pjax' => true ]]); ?>
<?= $form->field($model, 'medicine_id')->textInput(['maxlength' => 10]) ?>
<?= $form->field($model, 'medicine_name')->textInput(['maxlength' => 50]) ?>
<div class="form-group">
<?= Html::submitButton($model->isNewRecord ? 'Create' : 'Update', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
<?= Html::submitButton($model->isNewRecord ? 'Save & New' : '',$option=['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary','name'=>'save_and_new']) ?>
</div>
<?php ActiveForm::end(); ?>
<?php yiiwidgetsPjax::end() ?>
</div>
Code in my controller
public function actionIndex()
{
$model = new Medicine();
if ($model->load(Yii::$app->request->post()) && $model->save())
{
$model = new Medicine(); //reset model
}
$searchModel = new MedicineSearch();
$dataProvider = $searchModel->search(Yii::$app->request->queryParams);
return $this->render('index', [
'searchModel' => $searchModel,
'dataProvider' => $dataProvider,
'model' => $model,
]);
}
code in index.php
<?php
use yiihelpersHtml;
use yiigridGridView;
/* @var $this yiiwebView */
/* @var $searchModel appmodelsMedicineSearch */
/* @var $dataProvider yiidataActiveDataProvider */
$this->title = 'Medicines';
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="medicine-index">
<h1><?= Html::encode($this->title) ?></h1>
<?php // echo $this->render('_search', ['model' => $searchModel]); ?>
<p>
<?= Html::a('Create Medicine', ['create'], ['class' => 'btn btn-success']) ?>
</p>
<?php yiiwidgetsPjax::begin(['id' => 'medicine']); ?>
<?= GridView::widget([
'dataProvider' => $dataProvider,
'filterModel' => $searchModel,
'columns' => [
['class' => 'yiigridSerialColumn'],
'id',
'medicine_id',
'medicine_name',
['class' => 'yiigridActionColumn'],
],
]); ?>
<?php yiiwidgetsPjax::end(); ?>
</div>
I think I have followed the instructions very carefully, but surely I am missing something as the grid-view is not showing the new records added without page-reload.
Any help will be greatly appreciated. Thanks.
try to explain how to do it as a widget; it's a generic solution, so contact me in case of troubles:
Controller (@your-alias/controllers/yourController):
...
public function actionManage($param=''){
$model = new YourModel();
if (Yii::$app->request->isPjax && $model->load(Yii::$app->request->post()) && $model->save())
{
$model = new YourModel(); //reset model
}
$model->paramId = $param;
$queryParams = Yii::$app->request->getQueryParams();
$queryParams['YourModelSearch']['param'] = $param;
$searchModel = new YourModelSearch();
$dataProvider = $searchModel->search($queryParams);
return $this->renderAjax('@your-alias/widgets/views/index', [
'searchModel' => $searchModel,
'dataProvider' => $dataProvider,
'model' => $model,
]);
}...
widgets (@your-alias/widgets/) [form, view]:
_form:
use yiihelpersHtml;
use yiiwidgetsActiveForm;
use yiiwidgetsPjax;
/**
* @var yiiwebView $this
* @var yourModule/models/YourModel $model
* @var yiiwidgetsActiveForm $form
*/
?>
<?php
$js = <<<JS
// get the form id and set the event
$('form#{$model->formName()}').on('beforeSubmit', function(e) {
var $form = $(this);
// do whatever here, see the parameter $form? is a jQuery Element to your form
console.log($form);
console.log("MODEL CODE = " + $("#yourmodel-code").val());
}).on('submit', function(e){
e.preventDefault();
});
JS;
//$this->registerJs($js);
$this->registerJs(
'$("#new-your-model").on("pjax:end", function() {
commonLib.divAction("#div_new_model", "hide"); //hide form
$.pjax.reload({container:"#models"}); //Reload GridView
});', yiiwebView::POS_READY
);
?>
<div class="model-form">
<?php Pjax::begin(['id' => 'new-model', 'timeout' => false, 'enablePushState' => false]) ?>
<?php $form = ActiveForm::begin([
'id' => $model->formName(),
//'method' => 'post',
'action' => ['/module/controller/manage?param='.$model->code],
'options' => ['data-pjax' => true ],
//'layout' => 'default',
]); ?>
<?= $form->field($model, 'code')->textInput(['maxlength' => 255]) ?>
...
<div class="form-group">
<?= Html::submitButton($model->isNewRecord ? 'Create' : 'Update', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
<?php yiiwidgetsPjax::end() ?>
</div>
index view (grid view):
use yiihelpersHtml;
use yiigridGridView;
use yiiwidgetsPjax;
/**
* @var yiiwebView $this
* @var yiidataActiveDataProvider $dataProvider
* @var yourModulemodelssearchYourModelSearch $searchModel
*/
?>
<div class="model-index">
<!--h1><!--?= Html::encode($this->title) ?></h1-->
<?php // echo $this->render('_search', ['model' => $searchModel]); ?>
<p>
<?= Html::button(Yii::t('bp', 'Add ...'), [
'class' => 'btn btn-success',
'onclick'=>'js:commonLib.divAction("#div_new_model", "show")'
])?>
</p>
<div id="div_new_model" style="display:none">
<?= Html::button(Yii::t('common', 'Cancel'), [
'class' => 'btn btn-success',
'onclick'=>'js:commonLib.divAction("#div_new_model", "hide")'
])?>
<!-- Render create form -->
<?= $this->render('_formModel', [
'model' => $model,
]) ?>
</div>
<?php Pjax::begin(['id' => 'models', 'timeout' => false, 'enablePushState' => false]) ?>
<?= GridView::widget([
'dataProvider' => $dataProvider,
'filterModel' => $searchModel,
'columns' => [
['class' => 'yiigridSerialColumn'],
...
['class' => 'yiigridActionColumn'],
],
]); ?>
<?php Pjax::end() ?>
</div>
widget call (in view):
echo @your-aliaswidgetsYourWidget::widget([
'param' => $model->param,]);
这篇关于Yii2:使用 Pjax 更新网格视图的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持html5模板网!