Editable row with number type

Question

How can i make this input type with number. I mean when the page is opened in mobile phone, it'll be open the number keyboard.

        [
        'class'=>'kartik\grid\EditableColumn',
        'headerOptions' => ['style' => 'width:10%', 'class'=>'text-center'],
        'editableOptions'=>[
            'asPopover' => false,
            'inputType'=>\kartik\editable\Editable::INPUT_TEXT,
            // Change here:
            'editableValueOptions'=>['type'=>'number']
        ],

        'attribute'=>'quantity',
        'label'=>'Quantity',
    ],

EDIT ->> add 'editableValueOptions'=>['type'=>'number']

score 0 · Answer 1 · answered Sep 11 '17 at 17:31

0

Use editableValueOptions. As the documentation says:

editableValueOptions: array, the HTML attributes for the editable value displayed.

        [
            'class'=>'kartik\grid\EditableColumn',
            'headerOptions' => ['style' => 'width:10%', 'class'=>'text-center'],
            'editableOptions'=>[
                'asPopover' => false,
                'inputType'=>\kartik\editable\Editable::INPUT_TEXT,
                // Change here:
                'editableValueOptions'=>['type'=>'number']
            ],

            'attribute'=>'quantity',
            'label'=>'Quantity',
        ],

answered Sep 11 '17 at 17:31

Imtiaz

2,484
2
26
32

I've tried but it still show a normal keyboard not number keyboard. i tried it on my browser phone. – adn Sep 24 '17 at 10:28
is there anything i have to change on my coding? – adn Sep 24 '17 at 10:40
when there's ``, your phone should respond with a numeric keypad. please inspect the rendered page using a chrome/mozilla developer tool. see if it shows a `type=number'` – Imtiaz Sep 24 '17 at 12:01
If the input type is number but your phone doesn't open a numeric keypad, change your keyboard app. – Imtiaz Sep 24 '17 at 12:02
i've checked with inspected rendered page. And it still show though i've added `'editableValueOptions'=>['type'=>'number']` – adn Sep 27 '17 at 01:53

score 0 · Answer 2 · answered May 23 '19 at 17:32

    'attribute' => 'quantity',
    'class' => 'kartik\grid\EditableColumn',
    'editableOptions'=>[
        'valueIfNull' => 'not set',
        'inputType' => \kartik\editable\Editable::INPUT_HTML5,
        'options' => [
            'type' => 'number',
            'min' => '0.5',
            'step' => '0.5',
        ],
    ],

You should use options array as shown above

Editable row with number type

2 Answers2