Yii2 Pjax on ActiveForm and GridView [ Got it Working]

Question

I have a gridview

<?php Pjax::begin(['id' => 'members']) ?> 

<?= GridView::widget([
        'dataProvider' => $dataProvider,
        // 'filterModel' => $searchModel,
        'columns' => [
        ['header'=>'Remove Member',
                        'value'=> function($data)
                        { 
                            return  Html::a(Yii::t('app', ' {modelClass}', [
                                'modelClass' =>'',
                            ]), ['members/stl_remove','id'=>$data->id], 
                            ['class' => 'btn btn-link fa fa-times fa-2x pop']
                            );  
                        },
            'format' => 'raw'
            ],
      ['class' => 'yii\grid\ActionColumn','template'=>'{update}'],
        ],
    ]); ?>
    <?php Pjax::end() ?>

when i click on the Remove members link a modal popsup (delete.php)

<?php Pjax::begin(['id' => 'delete_members']) ?>

    <?php $form = ActiveForm::begin(['options' => ['data-pjax' => true ]]); ?> 

    <div class="row">
        <div class="col-md-5">

            <?php echo $form->field($model, 'remarks')->dropDownList(['death' => 'Death',
                'marriage' => 'Marriage', 'house_shift' => 'House Shift'],['prompt'=>'Select'])
                ->label("Reason For Removal"); ?>

        </div>
    </div>
    <div class="form-group">
        <?= Html::submitButton($model->isNewRecord ? Yii::t('app', 'Remove') : Yii::t('app', 'Update'), ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
    </div>

    <?php ActiveForm::end(); ?>
    <?php yii\widgets\Pjax::end() ?>

Now these are my controller code [code]

public function actionStl_remove($id,$ajax=0)
    {
        $model              =   $this->findModel($id);
        $model_delete       =   new Members();
        $model->scenario    =   "remove";

        if ($model_delete->load(Yii::$app->request->post())) 
        {
            $model->remarks =   $model_delete->remarks;
            $model->status  =   1;
            $model->save();
            // $model = new Members();
            // return $this->redirect(['index']);
        }
        else
        {
        return $this->renderAjax('delete', [
                'model' =>  $model_delete,
                'id'    =>  $id,
            ]);
        }
    }

I am not able to get data loaded into gridview. I click on the link modal popsup then i submit after that i go on to the index page and the page reloads

Answer 1

This is how i got it working. In delete.php i made following changes.

<?php $form = ActiveForm::begin([
    'options' => ['data-pjax' => true,
                  'id'=> 'dynamic-form111',
                  // 'validationUrl' => 'validation-rul'
                   ]]); ?> 

    <div class="row">
        <div class="col-md-5">

            <?php echo $form->field($model, 'remarks')->dropDownList(['death' => 'Death',
                'marriage' => 'Marriage', 'house_shift' => 'House Shift'],['prompt'=>'Select'])
                ->label("Reason For Removal"); ?>

        </div>
    </div>
    <div class="form-group">
        <?= Html::submitButton($model->isNewRecord ? Yii::t('app', 'Remove') : Yii::t('app', 'Update'), ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
    </div>

    <?php ActiveForm::end(); ?>

basically i gave an id to the from dynamic-form111. Then in index.php along with gridview in pjax i added the below code

<?php
$this->registerJs(
    'jQuery(document).ready(function($){
                $(document).ready(function () {
                    $("body").on("beforeSubmit", "form#dynamic-form111", function () {
                        var form = $(this);
                        // return false if form still have some validation errors
                        if (form.find(".has-error").length) 
                        {
                            return false;
                        }
                        // submit form
                        $.ajax({
                            url    : form.attr("action"),
                            type   : "post",
                            data   : form.serialize(),
                            success: function (response) 
                            {

                                $("#ajaxModal").modal("toggle");
                                $.pjax.reload({container:"#countries"}); //for pjax update

                            },
                            error  : function () 
                            {
                                console.log("internal server error");
                            }
                        });
                        return false;
                     });
                    });

    });'
);
?> 

which via ajax check if delete.php has been submitted successfully if yes then reloads gridview using pjax and closes modal.