How to add Yii2 jui datepicker to filter field in GridView

You can use below code for filer by date picker.

First import datepicker

use kartik\date\DatePicker;

Then use below code in gridview

[
             'attribute' => 'order_date',
             'value' => 'order_date',
             'format' => 'raw',
             'label' => "Order Date",
             'filter' => DatePicker::widget([
                 'model' => $searchModel,
                 'name' => 'OrdersdropSearch[order_date]',
                 'value' => ArrayHelper::getValue($_GET, "OrdersdropSearch.order_date"),
                 'pluginOptions' => [
                     'format' => 'yyyy-mm-dd',
                     'autoclose' => true,
                 ]
             ])
         ],

Search model will be same.


Your widget params are wrong and you should use html or raw format :

        [
            'attribute' => 'list_date',
            'value' => 'list_date',
            'filter' => \yii\jui\DatePicker::widget(['language' => 'ru', 'dateFormat' => 'dd-MM-yyyy']),
            'format' => 'html',
        ],

Read more about Data Formatting.


I tried this and works fine:

[
    'attribute' => 'updated_at',
    'value' => 'updated_at',
    'filter' => \yii\jui\DatePicker::widget([
        'model'=>$searchModel,
        'attribute'=>'updated_at',
        'language' => 'ru',
        'dateFormat' => 'dd-MM-yyyy',
    ]),
    'format' => 'html',
],

Then, you must add this line to your Search Model:

$query->andFilterWhere([

    ...

    'DATE(updated_at)' => $this->updated_at,
]);

Make sure the date formats are identical.


 [
            'attribute' => 'updated_at',
            'value' => 'updated_at',
            },
            'filter' => \yii\jui\DatePicker::widget([
                    'model'=>$searchModel,
                    'attribute'=>'updated_at',
                    'language' => 'ru',
                    'dateFormat' => 'dd-MM-yyyy',
                ]),
            'format' => 'html',
        ],