Hi,
I am unable to get PJAX working when updating through popup Modal. I’ve followed a few helpful articles but still not having success.
index.php:
<?php
use yii\grid\GridView;
use yii\helpers\Html;
use yii\helpers\Url;
use yii\widgets\Pjax;
$this->title = 'Service Offerings';
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="service-offering-index">
<h1><?= Html::encode($this->title).' '.date("G:i:s a") ?></h1>
<p>
<?= Html::a('Create Service Offering', ['create'], ['class' => 'btn btn-success']) ?>
</p>
<?php
yii\bootstrap\Modal::begin([
'header' => 'Update Service Offering',
'id'=>'editModalId',
'class' =>'modal',
'size' => 'modal-md',
]);
echo "<div class='modalContent'></div>";
yii\bootstrap\Modal::end();
//js code:
$this->registerJs("$(document).pjax('a', '#some-id');");
$this->registerJs(
"$(document).on('ready pjax:success', function() {
$('.modalButton').click(function(e){
e.preventDefault(); //for prevent default behavior of <a> tag.
var tagname = $(this)[0].tagName;
$('#editModalId').modal('show').find('.modalContent').load($(this).attr('href'));
});
});
");
//$this->registerJs("$.pjax.reload('#some-id', options)");
?>
<?php \yii\widgets\Pjax::begin(['id'=>'some-id']);
echo GridView::widget([
'dataProvider' => $dataProvider,
'columns' => [
'title',
'service_type',
[ 'attribute' => 'description', 'options'=>['style' => 'width:70%'], ],
'service_status',
// Reference for AJAX implementation: http://stackoverflow.com/questions/34626334/bootstrap-modal-not-working-with-pjax-in-gridview-yii2
['class' => 'yii\grid\ActionColumn', 'template'=>'{custom_view}',
'buttons' =>
[ 'custom_view' => function ($url, $model) {
// Html::a args: title, href, tag properties.
return Html::a( '<i class="glyphicon glyphicon-new-window"></i>',
['service-offering/update', 'id'=>$model['id']],
['class'=>'btn btn-xs btn-default modalButton', 'title'=>'view/edit offering', ]
);
},
]
]
],
]);
\yii\widgets\Pjax::end(); ?>
</div>
My form is:
<?php
use yii\helpers\Html;
use yii\widgets\ActiveForm;
?>
<div class="service-offering-form">
<?php $form = ActiveForm::begin(['id'=>'service-offering-form-id', ]); ?>
<?= $form->field($model, 'title')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'description')->textarea(['rows' => 6]) ?>
<div class="form-group">
<?= Html::submitButton($model->isNewRecord ? 'Create' : 'Update', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
</div>
Controller actions:
public function actionIndex()
{
$dataProvider = new ActiveDataProvider([
'query' => VwServiceOffering::find(),
]);
return $this->render('index', [
'dataProvider' => $dataProvider,
]);
}
public function actionUpdate($id)
{
$model = $this->findModel($id);
if ($model->load(Yii::$app->request->post()) && $model->save()) {
//return $this->redirect(['view', 'id' => $model->id]);
return $this->redirect( Yii::$app->request->referrer );
} else {
return $this->renderAjax('update', [
'model' => $model,
]);
}
}
The modal & functions work correctly but I’m still getting a page refresh on actionUpdate (as evidenced by the time function next to the title value (index.php - $this->title.’ '.date(“G:i:s a”)) above.
I appreciate any assistance. Thanks.
