Yii2 Pjax Delete not working

Question

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,
    ]);
}

Uroscopy

Have you specified Pjax::end(); In your above code it is missing after gridview. – Therewithal

My solution work like a charm....i personally used in my Project – Corr

Answer 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.

Tensity

Answer 2

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.

Calton

Answer 3

<?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,
    ]);
}

Brace

Answer 4

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.

Pollinize

+1 also for the feature request on GitHub! This method works well also with data-confirm & data-method="post" – Concord

Answer 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,
]);

Chenay

Answer 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']);
}

Therewithal

Updated. Please change your controller code and then check. – Therewithal

checked but still the same, I think because of that "return $this->redirect(['index']);" in the controller – Dioxide

I have the same problem, delete sends a normal request, not an AJAX request. – Perceive

data-confirm currently disables the pjax request see this issue github.com/yiisoft/yii2/issues/8582 – Indispose

so you can't delete in gridview using pjax if you use data-confirm ? – Betray

Answer 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']

Corr