Difficult to setup editable column using Kartik gridview {SOLVED}

Hi everyone,
I’m having problem in setting editable column for Kartik gridview.
refer to the documentation, I already doing this.
First important thing.

        $query = EmpAttendance::find()->indexBy('id');
        $query->joinWith(['employee', 'createdBy']); 

        // add conditions that should always apply here

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

and second I setup my controller like this and i don’t understand :slight_smile:

public function actions(){
            return ArrayHelper::merge(parent::actions(), [
                'editempattendance' => [                                       // identifier for your editable column action
                    'class' => \kartik\grid\EditableColumnAction::class,     // action class name
                    'modelClass' => EmpAttendance::class,                // the model for the record being edited
                    'outputValue' => function ($model, $attribute, $key, $index) {
                            return (int) $model->$attribute / 100;      // return any custom output value if desired
                    },
                    'outputMessage' => function($model, $attribute, $key, $index) {
                            return '';                                  // any custom error to return after model save
                    },
                    'showModelErrors' => true,                        // show model validation errors after save
                    'errorOptions' => ['header' => 'error options']                // error summary HTML options
                    // 'postOnly' => true,
                    // 'ajaxOnly' => true,
                    // 'findModel' => function($id, $action) {},
                    // 'checkAccess' => function($action, $model) {}
                ]
            ]);
    }

and the third, configure Kartik gridview editableColumn

[   
            'class' => 'kartik\grid\EditableColumn',
            'attribute' => 'machine_time', 
            'format' => ['decimal', 0], 
            'hAlign' => 'right',
            'editableOptions' => [
                //'header' => 'Buy Amount', 
                'formOptions' => ['action' => ['/emp-attendance/editempattendance']],
                'inputType' => \kartik\editable\Editable::INPUT_SPIN,
                'options' => [
                    'pluginOptions' => ['min' => 0, 'max' => 5000]
                ]
            ],
],

and the result by going index view always pop-up the edit form for column that using editableColumn. Am i missing something ?? please advice. thanks

Can you say what the problem is?

before clicking the editable column, already pop-up the form (edit jam mesin)
It suppose to be after clicking the editable column, and pop-up the form to edit the value.

Where is that column in Grid? I do not see any editable column or column with buy. Are you sure you posted correct view code?

here, i had already posted it.

That has been answered some years ago in github: When i use bootstrap 4 then EditableColumn popup is by deafult open. · Issue #871 · kartik-v/yii2-grid · GitHub

It is valid for BS5 too.

1 Like

aha, you are right. thanks alot.
this is for bootstrap 4 (i’m currently use).

add this script to your view file according to NestorAcevedo1

$this->registerCss('.popover-x {display:none}');

thanks again.

1 Like