{"id":302985,"date":"2021-08-27T13:54:01","date_gmt":"2021-08-27T13:54:01","guid":{"rendered":"https:\/\/webkul.com\/blog\/?p=302985"},"modified":"2021-09-03T04:57:42","modified_gmt":"2021-09-03T04:57:42","slug":"toggle-status-through-ajax-from-the-list-in-prestashop","status":"publish","type":"post","link":"https:\/\/webkul.com\/blog\/toggle-status-through-ajax-from-the-list-in-prestashop\/","title":{"rendered":"Toggle status through AJAX in render list in PrestaShop"},"content":{"rendered":"\n

In this blog, we are going to learn how to toggle the status of a particular record in the render list through AJAX (without reloading the list page) in PrestaShop.<\/p>\n\n\n\n

\"Toggle
Toggle status through AJAX in the render list in PrestaShop<\/figcaption><\/figure>\n\n\n\n

In PrestaShop, when we toggle the status of a particular record from the admin list view, PrestaShop reloads the whole page which is very annoying sometimes.<\/p>\n\n\n\n

Suppose you have a table ‘ps_test_user’ with 5 columns id_user, name, mobile, active and date_add.<\/p>\n\n\n\n

For creating list columns in the back office, we define the ‘fields_list’ variable with the name of columns and its type in the admin controller\u2019s class constructor:<\/p>\n\n\n\n

ie.<\/p>\n\n\n\n

$this->fields_list = array(\n    'id_user' => array(\n        'title' => $this->l('ID'),\n        'align' => 'text-center',\n        'class' => 'fixed-width-xs'\n    ),\n    'name' => array(\n        'title' => $this->l('Name'),\n    ),\n    'mobile' => array(\n        'title' => $this->l('Phone'),\n    ),\n    'active' => array(\n        'title' => $this->l('Status'),\n        'active' => 'status',\n        'align' => 'center',\n        'type' => 'bool',\n        'orderby' => false,\n    ),\n    'date_add' => array(\n        'title' => $this->l('Date'),\n        'align' => 'text-left',\n        'type' => 'datetime',\n        'class' => 'fixed-width-lg',\n    ),\n);<\/pre>\n\n\n\n
To prevent the reloading of the list page when changing the status of a record, we have to modify the ‘active’ column definition:<\/p>\n\n\n\n