Yii2 Pjax Delete not working

问题:

I am trying to make an Ajax GridView using Pjax with delete button. Deleting goes with no Ajax. I am new to Yii2 so any help would be appreciated. Thank you.

index.php

<?php Pjax::begin(['id' => 'countries']) ?>
<?= GridView::widget([
    'dataProvider' => $dataProvider,
    'columns' => [
        ['class' => 'yii\grid\SerialColumn'],

        'id',
        'title',


        ['class' => 'yii\grid\ActionColumn',
            'buttons' => [
                'delete' => function ($url, $model, $key) {
                    return Html::a('<span class="glyphicon glyphicon-trash"></span>', $url, [
                        'title' => Yii::t('yii', 'Delete'),
                        'data-confirm' => Yii::t('yii', 'Are you sure you want to delete this item?'),
                        'data-method' => 'post',
                    ]);
                },
            ]
        ],
    ],
]); ?>
<?php Pjax::end() ?>

Controller

public function actionDelete($id)
{   
    $model = new Category();
    $this->findModel($id)->delete();
    $dataProvider = new ActiveDataProvider([
        'query' => Category::find(),
    ]);
    return $this->render('index', [
        'dataProvider' => $dataProvider,
        'model' => $model,
    ]);
}

This is public function actionIndex() in the Controller

public function actionIndex()
{
    $model = new Category();

    $dataProvider = new ActiveDataProvider([
        'query' => Category::find(),
    ]);

    if ($model->load(Yii::$app->request->post()) && $model->save())
    {
        $model = new Category();
    }
    return $this->render('index', [
        'dataProvider' => $dataProvider,
        'model' => $model,
    ]);
}

回答1:

data-method and data-confirm don't let you create ajax request via pjax, you should implements your own confirmation dialog and drop POST verb filter, or you can implements your own ajax plugin with confirmation dialog and specifying http method.

Also, i think, there must be way to extend pjax plugin by confirmation dialog, but Yii2 don't provide this by default.

回答2:

<?php Pjax::begin(['id' => 'model-grid']);
    'dataProvider' => $dataProvider,
    'filterModel' => $searchModel,
    //...
    [
            'class' => 'yii\grid\ActionColumn',
            'template' => '{update} {delete}',
            'contentOptions' => ['class' => 'action-column'],
            'buttons' => [
                'delete' => function ($url, $model, $key) {
                    return Html::a('<span class="glyphicon glyphicon-trash"></span>', $url, [
                        'title' => 'Delete',
                        'data-pjax' => '#model-grid',
                    ]);
                },
            ],
        ],
    ],
]); 
Pjax::end(); ?>

In controller

public function actionDelete($id)
{
    $this->findModel($id)->delete();
    $searchModel = new ModelSearch();
    $dataProvider = $searchModel->search(Yii::$app->request->queryParams);
    return $this->render('index', [
        'searchModel' => $searchModel,
        'dataProvider' => $dataProvider,
    ]);
}

回答3:

Please try modify actionDelete()

public function actionDelete($id)
{   
    $this->findModel($id)->delete();
    return \yii\web\Response::redirect(['index'] , 302 , false);
    // return $this->redirect(['index']);
}

because Controller->redirect() can not disable ajaxCheck , you need use Response to do this.

I have create the same issue in https://github.com/yiisoft/yii2/issues/11058.

回答4:

first of all remove 'data-confirm' and 'data-method' => 'post'. pjax not going to work. If you want to implement a confirm box with action button, here is what I would do in my view index.php file ..

<?php  Pjax::begin(['id' => 'pjax-container']); 
echo GridView::widget([
    'test' => function ($url, $dataProvider) {
    return Html::a('Test',
        ['/site/test'],
        ['title'=>'Test',
         'onclick' => "if (confirm('ok?')) {
              $.ajax('/site/test', {
                  type: 'POST'
              }).done(function(data) {
                   $.pjax.reload({container: '#pjax-container'});
              });
          }
          return false;
          ",
          ]);
        },
    ])
Pjax::end();
?>

and in my controller

public function actionTest()
{

    if (!Yii::$app->request->isAjax) {
        return $this->redirect(['index']);
    }
}

This way you would have confirmation etc. as well. If you want you may use other third party bootstrap confirmation etc. and will work fine.

回答5:

Can use like this:

in view:

'delete' => function ($url, $model, $key) {
  $options = [
    'title' => Yii::t('common', 'delete'),
    'aria-label' => Yii::t('common', 'delete'),
    'data-pjax' => 'w0',//id
    'data-confirm' => Yii::t('yii', 'Are you sure you want to delete this item?'),
    'data-method' => 'post',
    'class' => 'btn btn-xs btn-danger'
  ];
  return Html:: a('<i class="fa fa-fw fa-trash"></i>', [
    'delete',
    'id' => $model -> id
  ], $options);
}

in controller:

$this -> findModel($id) -> delete ();
$searchModel = new AdminSearch();
//get the referer url
$url = Yii::$app -> request -> referrer;
$arr = parse_url($url, PHP_URL_QUERY);
parse_str($arr, $output);//get the $_GET array
$dataProvider = $searchModel -> search($output);
return $this -> render('index', [
  'searchModel' => $searchModel,
  'dataProvider' => $dataProvider,
]);

回答6:

First add Pjax::end(); at end of the gridview then specify:

    'delete' => function ($url, $model, $key)
    {
         return Html::a('<span class="glyphicon glyphicon-trash"></span>', $url, [
                'title' => Yii::t('yii', 'Delete'),
                'data-confirm' => Yii::t('yii', 'Are you sure you want to delete this item?'),
                'data-method' => 'post',
      ]);
   },

Note that you don't need to specify 'data-pjax' => '0' because it disables the pjax link.

For more details check this link

Your controller should be:

public function actionDelete($id)
{   
    $this->findModel($id)->delete();
    return $this->redirect(['index']);
}

回答7:

Don't set data-method and data-confirm because Pjax not supported that.

After removing both still not workign,yes because of below code of your controler does not allow Pjax get Request.

return [
            'verbs' => [
                'class' => VerbFilter::className(),
                'actions' => [
                    'delete' => ['post'], // **remove this**
                ],
            ],
        ];

You need to use Pjax Post Method Apply this in Your Pjax

'clientOptions' => ['method' => 'POST']