Filter CGridView with dateStart and dateEnd

Hi, is it possible to filter column "dateStart" and column "dateEnd" in a CGridView using a sort of date picker in filter row?

I’ve created a CGridView using 1.1.2 yiic console (very nice, indeed) and it display something like 00-00-0000 00:00 in dateStart and dateEnd columns, in the row where filters are. Now I would like to improve that, using a date picker. Any suggestion?

TIA

Danilo

Hello zitter,

Have you found a solution? I have the same problem :( .

Thank you.

You can use the property filter of CDataColumn.

You can set it in items:




items=>array(

   dateStart=>array(

      [...]

      'filter'=>$this->widget('CJuiDatepicker'),

  ),

),



I used this :




<?php $this->widget('zii.widgets.grid.CGridView', array(

        'id'=>'facture-grid',

        'dataProvider'=>$model->search(),

        'filter'=>$model,

        'columns'=>array(

                'FullNumFact',

		array('name'=>'DateFact',

			'value'=>'$data->DateFact',

			'filter'=>$this->widget('CJuiDatepicker'),

		),           

        ),

)); ?>



But it does not work, Here is the error :

CJuiDatePicker must specify "model" and "attribute" or "name" property values.

‘items’ or ‘columns’? I tried it like this:




'columns'=>array(

	array(

		'name'=>'register_date',

		'value'=>'$data->RegisterDate',

		'filter'=>$this->widget('zii.widgets.jui.CJuiDatepicker', array('model'=>$model, 'attribute'=>'register_date')),

	),

),



But then I get an error: Object of class CJuiDatePicker could not be converted to string

in the renderFilterCellContent() function of CDataColumn.php.

GSTAR, you are right, is columns, not item.

try with:


'columns'=>array(

        array(

                'name'=>'register_date',

                'value'=>'$data->RegisterDate',

                'filter'=>$this->widget('zii.widgets.jui.CJuiDatepicker', array('model'=>$model, 'attribute'=>'register_date'), true),

        ),

),

The fourth parameter should capture the output and return the html.

Just tried it but nothing happens when clicking in the filter field. Have you tested this?

No, I didn’t.

I guess that you should write some javascript for make the validation happen at the selection of the date.

I just tested right now and there is a problem with clientScript.

The calendar does the search the first time, but later it doesn’t work anymore. The only solution here is to work without the widget, inlcude manually Jquery-ui javascript and CSS and call Jquery.datepicker manually.

Ok, how I tested and I got a solution:




<?php $this->widget('zii.widgets.grid.CGridView', array(

	'id'=>'town-description-grid',

	'dataProvider'=>$model->search(),

	'filter'=>$model,

	'afterAjaxUpdate'=>"function(){jQuery('#".CHtml::activeId($model, 'town_id')."').datepicker([])}",

	'columns'=>array(

		array(

			'name'=>'town_id',

			'value'=>'$data->town->recordDescription',

            'filter'=>$this->widget('zii.widgets.jui.CJuiDatepicker', array('model'=>$model, 'attribute'=>'town_id'), true),


		),

		'title',

		'description',

		array(

			'class'=>'CButtonColumn',

		),

	),

)); ?>

We have to specify the filter as CJuiDatepicker, and it is working only the first time.

In order to make it work after ajaxUpdate, we have to set the property afterAjaxUpdate.

Hope this helps

Thank you for Help, but i have an error javascript :

d(a).zIndex is not a function

The file is : localhost/test/assets/b466101/jui/js/jquery-ui.min.js

I have too sometime, but I dont’t know what is, maybe a jquery error.

Try updating the framework, maybe they fixed it.

ok, I’ll do the update and inform you.

Thank you :)

It does not even work for me first time…

for me also

I did the update, and it works, the calendar appears but when I click to select the date, an error appears:

$.param.querystring is not a function

File "jquery.yiigridview.js" line 146 :

options.url = $.param.querystring(options.url, options.data);

I have really no words… on my installation with the lastest framework is working correctly… I tested with firefox, IE opera, chrome and safari on windows.

Such a huge number of different behavior, really no idea of what can be.

$.param.querystring is defined in the "jquery.ba-bbq.js" file… check that you have included this JS file…

The problem was solved :)

I did the update of the framework, but the file versions of jquery remain the same, so I used this statement to replace them with the latest versions ( Jquery 1.4.2 and Jquery UI 1.7.1 ) and it works well.




$cs=Yii::app()->clientScript;

$cs->scriptMap=array(

    'jquery.js'=>Yii::app()->request->baseUrl.'/js/jquery-1.4.3.min.js',

    'jquery-ui-1.7.1.custom.min.js'=>Yii::app()->request->baseUrl.'/js/jquery-ui-1.8.5.custom.min.js',

);



Thank you for all.

MAybe you should clean assets and runtime after the update, that can explain why your file didn’t changed.