» » » How to create the bulk action in Yii2

How to create the bulk action in Yii2

Follow by Email
Facebook
3 min read

Howdy, working in the back-end in the web application, often you will find the bulk actions is very useful when you want to do the action with more than one records at once. Today I will share with you how to create bulk actions and work with grid view widget. Plus I use the pjax widget to make the changes from the action without reloading the whole page.

 

The screenshot below shows the bulk action in Yii2

 

Here is what we will do step by step

  • create the bulk actions in the views.
  • add the checkbox class in the grid view widget in the views.
  • create the bulk action in the controllers

 

Create the bulk actions in the views

views/index.php

<?= Html::beginForm(['bulk'],'post',
    [
        'id' => 'bulk-action-form',
        'data-pjax' => ''  // enable Pjax for this form so the page will do the action and reload after the action finishes.
    ]); ?>
<?= Html::submitButton('Update', ['class' => 'btn btn-success btn-flat pull-right', 'id' => 'bulk-action-btn']); ?>             
<?= Html::dropDownList('action', \frontend\modules\timesheet\models\Timesheet::STATUS_UNBILLED,
    \frontend\modules\timesheet\models\Timesheet::getStatus(),
    [
        'class' => 'dropdown form-control pull-right',
    ])?>
    
<?= GridView::widget([
    ...

In grid view widget, add ‘class’ => ‘yii\grid\CheckboxColumn and ‘cssClass’ => ‘check’. The cssClass with ‘check’ value will allow the users be able to select all checkbox from the grid view checkbox.

<?= GridView::widget([
    'dataProvider' => $dataProvider,
    'filterModel' => $searchModel,
    'filterSelector' => '#pagesize',  // add the pagesize dropdown list to the search form in the Gridview widget
    'showFooter' => true,  // show footer section of the grid table
    'summary' => '<div class="summary">'. Yii::t('frontend','Showing') .' <b>{begin}</b> - <b>{end}</b> ' . Yii::t('frontend','of') . ' <b>{totalCount}</b> ' . Yii::t('frontend','items.') . ' </div>',
    'columns' => [       
        [
            'class' => 'yii\grid\CheckboxColumn',
            'cssClass' => 'check'  // must add 'cssClass' for select all or unselect all
        ],
    ...
?>
// this hidden input field will use in the actionBulk method in the controller.
<?= Html::hiddenInput('pagesize_hidden', '', ['id'=>'pagesize_hidden']); ?>    
<?= Html::endForm();?> 

At the end of the view file, add the JS code for assigning the ‘pagesize’ value from the drop down list to the ‘pagesize’ hidden field. Since the hidden field is in the form, we can get its value from $_POST in the controller.

<?php
$script = <<< JS

    // # important note: can not use $ to declare the js variable in Yii2 script. ex: $pagesize
    var pagesize = $('#pagesize');    
    var pagesize_hidden = $('#pagesize_hidden');   

    pagesize.on('change',function(){
        pagesize_hidden.val( pagesize.val() );
    });

JS;
$this->registerJs($script, \yii\web\View::POS_READY, 'pagesizes-handler');
?>

 

With Yii2, the pjax widget is very handy. It does the ajax call for you without extra code. I add the pjax widget to the grid view widget like below.

<?php Pjax::begin(); ?>
..our bulk actions form
..our gridview widget
<?php Pjax::end(); ?>

After I add the pjax widget, in my custom form(Html::beginForm()) for the bulk action form, I can add ‘data-pjax’ attribute to enable the pjax like the sample code above.

 

controllers/DefaultController.php

Create the bulk action and add the action you want to do with the selected checkbox from the view page.

<?php
    /**
     * Bulk action
     */
    public function actionBulk(){
        // get $_POST
        $action = Yii::$app->request->post('action');  // action is the name of the dropdown list, get the selected bulk action
        $selection = (array)Yii::$app->request->post('selection'); // the selected ID from the grid view
        // sample output from the $selection:
        // array (size=6)
        //     0 => string '8' (length=1)
        //     1 => string '7' (length=1)
        //     2 => string '6' (length=1)
        //     3 => string '5' (length=1)
        //     4 => string '10' (length=2)
        //     5 => string '9' (length=1)


        // # the form submission is for the filter
        $filter = Yii::$app->request->post('TimesheetSearch'); // TimesheetSearch is your filter 
        if( isset($filter) && is_array($filter) && count($filter)>0 && count($selection)==0 )
        {            
            // check the pagesize_hidden param
            $pagesize = Yii::$app->request->post('pagesize_hidden');
            if($pagesize === '') {
                $pagesize = 20; // my default pagesize
            }

            $param = '?pagesize='.$pagesize.'&';
            foreach($filter as $key=>$value) {
                // ex: TimesheetSearch[id]=1&TimesheetSearch[work_date]=
                $param .= 'TimesheetSearch[' . $key . ']' .'='. $value . '&';
            }

            // redirect with the query param
            return $this->redirect(['index'.$param]);
        }


        // # the form submission is for bulk action
        if(is_array($selection) && count($selection)>0) 
        {
            // your custom code here....
        }

        // redirect without the query param
        return $this->redirect(['index']);
    }  

?>

That’s it. It is very simple and works very well.

 

Follow by Email
Facebook