datepicker trigger event in yii

Question

My view code goes like this

<div class="row col2">
    <?php echo $form->labelEx($model,'visited_date'); ?>
    <?php 

    $this->widget('zii.widgets.jui.CJuiDatePicker',array(
        'model' => $model,
        'attribute'=>'visited_date',
        'options'=>array(
            'showAnim'=>'drop',//'slide','fold','slideDown','fadeIn','blind','bounce','clip','drop'
            'dateFormat' => 'yy-mm-dd',
            'showButtonPanel' => true,      
        ),
        'htmlOptions'=>array('size'=>30,'class'=>'date',  //'value'=> date("Y-m-d")

         ),
    ));
  ?>
    <?php echo $form->error($model,'visited_date'); ?>
</div>

    <div class="row col2">
    <?php echo $form->labelEx($model,'next_visited_date'); ?>
    <?php 
    $this->widget('zii.widgets.jui.CJuiDatePicker',array(
        'model' => $model,
        'attribute'=>'next_visited_date',
        'options'=>array(
            'showAnim'=>'drop',`enter code here`
            'dateFormat' => 'yy-mm-dd',
            'showButtonPanel' => true,
            ),
        'htmlOptions'=>array(
    'style'=>'height:20px; border-color: #448844;color:red; float:left;',
),
    ));
  ?>
<?php echo $form->error($model,'next_visited_date'); ?>
</div>

I am using yii 1 framework. I have two date pickers in my form i.e one to select visited-Date and another to select next-visitedDate. My next-visitedDate changes according to visited-Date i select .How to do so?

How to trigger on one date select to another datepicker? Please anyone help.

Answer 1

You could use onSelect event for your first dropdown:

    $this->widget('zii.widgets.jui.CJuiDatePicker',array(
        'model' => $model,
        'attribute'=>'visited_date',
        'options'=>array(
            'showAnim'=>'drop',//'slide','fold','slideDown','fadeIn','blind','bounce','clip','drop'
            'dateFormat' => 'yy-mm-dd',
            'showButtonPanel' => true,
            'onSelect'=> 'js:function( visitedDate ) {
                  $("#'.CHtml::activeId($model,'next_visited_date').'").datepicker( "option", "minDate", visitedDate );// or some other logic
             }',      
        ),
        'htmlOptions'=>array('size'=>30,'class'=>'date',  //'value'=> date("Y-m-d")

         ),
    ));

EDIT: Here is a complete rough example:

<?php
$this->widget('zii.widgets.jui.CJuiDatePicker',array(
    'name'=>'start-date',
    'options'=>array(        
        'showButtonPanel'=>true,
        'dateFormat'=>'yy-mm-dd',
        'onSelect'=> 'js:function( visitedDate ) {
                  date      = new Date(visitedDate);
                  date.setMonth( date.getMonth( ) + 1 );
                  newDate = date.getFullYear( )+"-"+( date.getMonth( ) + 1 )+"-"+date.getDate( );
                  console.log(newDate);
                  $("#end_date").val(newDate);
             }',
    ),
    'htmlOptions'=>array(
    ),
));
?>

<?php
$this->widget('zii.widgets.jui.CJuiDatePicker',array(
    'name'=>'end-date',
    'options'=>array(        
        'showButtonPanel'=>true,
        'dateFormat'=>'yy-mm-dd',
    ),
    'htmlOptions'=>array(
      'id'=>"end_date"
    ),
));
?>