Question

Problem : datepicker at filter is not working after filtering.

I tried to put the datepicker into filter of cgridview. It was success. but when the datepicker is not working after filtering. all of the cgridview has a same problem. How can I solve this problem?

before filter :
after filter :

This cgridview

<?php $this->widget('zii.widgets.grid.CGridView', array(
            'id'=>'history-grid',
            'dataProvider'=>$model->search($id),
            'filter'=>$model,
            'columns'=>array(
                array(
                    'name'=>'user_id',
                    'value'=>'$data->profiles->firstname',
                ),
                'action',
                array(
                    'name'=>'status',
                    'value'=>'$data->status',
                    'filter' => $status_list,
                ),
                array(
                    'name'=>'created_date',
                    'value'=>'date("d-M-Y h:m a",strtotime($data->created_date))',
                    'filter'=>$this->widget('zii.widgets.jui.CJuiDatePicker', array(
                        'name'=>'History[created_date]',        
                        'model'=>$model,
                        'value' =>date('d-M-Y', strtotime($model->created_date)) ,
                        'i18nScriptFile' => 'jquery.ui.datepicker-eng.js', // (#2)
                        'htmlOptions' => array(
                            'id' => 'History_created_date',
                            'size' => '10',
                        ),
                        'defaultOptions' => array(  // (#3)
                            'showOn' => 'focus', 
                            'dateFormat' => 'dd-M-yy',
                            'showOtherMonths' => true,
                            'selectOtherMonths' => true,
                            'changeMonth' => true,
                            'changeYear' => true,
                            'showButtonPanel' => true,
                            //'yearRange'=>'-1:+1', 
                            'yearRange'=> '2012:+1',
                            'minDate'=>'js:new Date(' . date('2012,m-3,1') . ')', 
                            //'defaultDate'=>'js:new Date(' . date('2012,m-11,1') . ')', 
                        )
                    ),true),    
                ),
            ),
        )); ?>

Answer 1

You need re-init datepicker after the cgridview updated. Read this: http://www.yiiframework.com/wiki/318/using-cjuidatepicker-for-cgridview-filter/

Add add afterAjaxUpdate in CGridView init options

'dataProvider'=>$model->search($id),
'filter'=>$model,
'afterAjaxUpdate' => 'reinstallDatePicker', // (#1)

And define this function:

// (#5)
Yii::app()->clientScript->registerScript('re-install-date-picker', "
function reinstallDatePicker(id, data) {
    $('#History_created_date').datepicker();
}
");