How to fill other value after calendar is clicked in Yii's CJuiDatepicker

5.9k views Asked by At

I have a problem to set the value of checkout date after calendar date is clicked. Here is the code. I try to fill value of check_out_date by give function onSelect, but nothing changes to target input value. Can anyone help me to give a solution?

Here is the piece of code:

    <div class="row">
<?php
        echo $form->labelEx($model, 'check_in_date');
        //echo $form->textField($model,'check_in_date');
        $this->widget('zii.widgets.jui.CJuiDatePicker', array(
            'name' => 'Reservation[check_in_date]',
            'value' => ($model->check_in_date) ?
                $model->check_in_date :
                date('m/d/Y'),
            'options' => array(
                'dateFormat' => 'mm/dd/yy',
                'disabled' => 'true',
                'showAnim' => 'fold',
                //'beforeShowDay' => 'js:$.datepicker.noWeekends',
                'onSelect' => 
                    'js:function() {
                        // to automatically assign check out date input value
                        $("#Reservation_check_out_date").val("04/23/2011");
                    }',
                'minDate' => '0',
                'changeMonth' => true,
                'changeYear' => true,
            ),
            'htmlOptions' => array(
                'style' => 'height:20px;'
            ),
        )
    );

    echo $form->error($model, 'check_in_date');
?>
    </div>
    <div class="row">
<?php
        echo $form->labelEx($model, 'check_out_date');
        //echo $form->textField($model, 'check_out_date');
        $this->widget('zii.widgets.jui.CJuiDatePicker', array(
/*
            'model'=>$model,
            'attribute' => 'check_out_date',
*/
            'name' => 'Resevation[check_out_date]',
            'value' => ($model->check_out_date) ?
                $model->check_in_date :
                date('m/d/Y', strtotime("+1 day")),
            'options' => array(
                'dateFormat' => 'mm/dd/yy',
                'showAnim' => 'fade',  
                'changeMonth' => true,
                'changeYear' => true,
                'showOn' => 'button',
                'buttonImage' => Yii::app()->request->baseUrl . '/images/calendar.png',
                'buttonImageOnly' => true,
                'beforeShow' =>
                    'js:function() {
                        var selectedDate = $("#' . CHtml::activeId($model, 'check_in_date') . '").datepicker("getDate");
                        selectedDate.setDate(selectedDate.getDate() + 1);
                        $(this).datepicker("option", "minDate", selectedDate);
                    }'
            ),
            'htmlOptions' => array(
                'style' => 'font-size:0.8em',
                'disabled' => 'disabled',
            ),
        )
    );

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

There are 2 answers

0
Daniel Vaquero On

You can take the Selected Date in 'onSelect' event, with a param on function(), like this:

'onSelect'=> 'js:function( selectedDate ) {}

And for apply this date to other datePicker you can do it in the following way:

    'onSelect'=> 'js:function( selectedDate ) {
                  $("#'.CHtml::activeId($model,'check_out_date').'").datepicker( "option", "minDate", selectedDate );
    }',
0
Zlatko On

Can you try:

'onSelect' => 'js:function() {$("#Reservation_check_out_date").setDate("04/23/2011");}',

jQuery UI doc: http://jqueryui.com/demos/datepicker/#method-setDate