yii2, partially render view with new data - php

Question

New to yii2 and PHP, ran into a break here.
Based on this and this post, I tried recreating the AJAX call.
Right now, using the Kartik SwitchInput widget, I'm at least trying to get the value into the controller and then return it to another place on the index page.
Here's what's in the view
...
<?= GridView::widget([
'dataProvider' => $customers,
'columns' => [
...
[
'label' => 'Status',
'format' => 'raw',
'attribute' => 'status',
'value' => function($models){
return SwitchInput::widget([
'name' => $models->id,
'value' => $models->status,
'pluginEvents' => [
'switchChange.bootstrapSwitch' => 'function(e) {
$.ajax({
method: "POST",
url: "'.Url::to(['update-status']).'",
data: { "status": e.currentTarget.checked, "id": e.currentTarget.name },
error:function(res){
console.log(res.responseText);
}
})
console.log(`${e.currentTarget.checked} ${e.currentTarget.name}`);
}'
]
...
Here's the controller:
class CustomerController extends Controller{
public function actionIndex(){
$customers = new ActiveDataProvider([
'query' => Customer::find()
]);
$models = $customers->getModels();
return $this->render('index', [
'customers' => $customers,
'models' => $models
]);
}
public function actionUpdateStatus(){
$status = Yii::$app->request->post('status');
$id = Yii::$app->request->post('id');
return $this->renderPartial('index', [
'status' => $status,
'id' => $id
]);
}
}
Whenever I flip the switch, it returns a 500 Internal error. Console.logging it revealed: $customers is undefined.
From what I realised, whenever I make an actionUpdateStatus call, Yii re-renders the view completely anyway, and tries to find the $customers, which isn't in the UpdateStatus.
How do I return the switch data, separately, back into the same view, then?

Answer 1

I posted one of the answers you mentioned, and i havent specified one thing there which is reloading of the gridview which wasnt the requirement there, but can be done using $.pjax.
A few things you need to look at
You dont need any view for the updateStatus action as per your requirement.
You just need to return some status code to the ajax call that you are using inside the gridView for the switch input, and refresh your gridview to load the new updated status.
In ajax success callback function check if that status code is ok then you should refresh the gridview rather than using render partial.
And you are not updating anything in the updateStatus? you need to switch the status
So change your action to the following
public function actionUpdateStatus()
{
try {
$status = Yii::$app->request->post('status');
$id = Yii::$app->request->post('id');
$model = Customer::findOne($id);
$model->status=$status;
if(!$model->save()){
throw new Exception(implode("\n",\yii\helpers\ArrayHelper::getColumn($model->errors,'0'));
}
return $this->asJson(['success' => true]);
} catch (Exception $e) {
return $this->asJson(['success' => false, 'message' => $e->getMessage()]);
}
}
Make sure you have wrapped the GridView inside Pjax start and end and add an id to the Pjax widget
<?php
Pjax::begin(['id'=>'pjax-container']);
echo GridView::widget([
'dataProvider' => $customers,
'columns' => [
.......
]);
Pjax::end();
?>
And your ajax call to the following
'switchChange.bootstrapSwitch' => 'function(e) {
$.ajax({
method: "POST",
url: "'.Url::to(['update-status']).'",
dataType:'json',
data: { "status": e.currentTarget.checked, "id": e.currentTarget.name },
success:function(data){
if(data.success){
$.pjax({container: "#pjax-container"});
}else{
console.log(data.message);
}
},
error:function(res){
console.log(res.responseText);
}
});
}'