日期選擇器在過濾器搜索框中

Question

我有我的觀點 以下使用bootstrap.widgets.TbGridView是相同的截圖： -

我想在我的日期過濾器datepickder。 plz幫助我如何把這個>

以下是我對相同的代碼： -

$this->widget('bootstrap.widgets.TbGridView', array(
    'dataProvider'=>$model->search(), 
    'filter'=>$model, 
    'type'=>'striped bordered condensed', 
    'pager' => array('htmlOptions'=>array('class'=>'pager', 
              'maxButtonCount' => 3)), // set whatever css class you want 
    'columns'=>array(
      array(
        'header'=>'Type', 
        'name'=>'sparktype_id', 
        'value'=>'sparktype::itemssparktypesname($data->sparktype_id)', 

      ), 
     array(
      'header'=>'Headline', 
      'name'=>'headline', 
      'type'=>'raw', 
      'value'=>'CHtml::link(CHtml::encode($data->headline), $data->url)', 

     ), 
     array(
        'header'=>'Date', 
        'name'=>'added_date', 
        'type'=>'date', 
        'value'=>'$data->added_date', 
      ), 
      array(
        'header'=>'State', 
        'name'=>'statemetro_id',    'value'=>'statemetro::itemstateforspark($data->sparkdetails[0]->statemetro_id)', 
        'type'=>'raw', 

      ),array('class'=>'CButtonColumn', 
      'deleteConfirmation'=>'Are you sure you want to delete this Spark ?', 
      'htmlOptions'=>array('width'=>70), 

    ), 
), 

））;

Answer 1

您可以實現這樣一個datepicker： -

$this->widget('zii.widgets.grid.CGridView', array(
    'dataProvider' => $model->search(), 
    'filter' => $model, 
    'afterAjaxUpdate' => 'reinstallDatePicker', 
    'columns' => array(
    ... 
     array(
      'header'=>'Date', 
      'name'=>'added_date', 
      'filter' => array(
       'model' => $model, 
       'attribute' => 'added_date', 
       'htmlOptions' => array(
        'id' => 'datepicker_for_added_date', 
        'size' => '10', 
       ), 
       'defaultOptions' => array(
        'shownOn' => 'focus', 
        'dateFormat' => 'yy-mm-dd', //Change your date format accordingly 
        //These are normal DatePicker options, omit unnecessary ones 
        'showOtherMonths' => true, 
        'selectOtherMonths' => true, 
        'changeMonth' => true, 
        'changeYear' => true, 
        'showButtonPanel' => true, 
       ), 
      ), 
     ), 
    ... 

並在此之後在你的網頁編寫代碼： -

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

僅供參考，你可以參考這個網頁： - http://www.yiiframework.com/wiki/318/using-cjuidatepicker-for-cgridview-filter/