#เลือกวันที่เริ่มต้น ในการเลือกวันที่เริ่มต้นนั้น Jquery จะทำการระบุวันที่ สิ้นสุดให้ และระบุจำนวนให้ 1 วัน และเมื่อทำการเลือกข้อมูลวันที่ สิ้นสุด ก็จะมีการคำนวณ จำนวนวันใหม่อีกครั้ง
โดยจำนวนวันจะถูกจัดเก็บใน textbox ID CarRental_rentDays
<?php
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'model' => $carRental,
'attribute' => 'begin_date',
'options' => array(
'showAnim' => 'fold',
'dateFormat' => 'dd/mm/yy',
//'minDate' => '0',
'minDate' => 'new Date()',
'changeYear' => 'true', // แสดง Dropdown เลือกปี
'changeMonth' => 'true', // แสดง Dropdown เลือกเดือน
'onSelect' => 'js:function( selectedDate ) {
$( "#' . CHtml::activeId($carRental, 'end_date') . '" ).datepicker("option", "minDate", selectedDate); //set the end date cjuidatepiker minDate and its working fine
$("#CarRental_end_date").val(selectedDate);
var startDate = $("#CarRental_begin_date").val().split("/");
var begin_date = new Date(startDate[2], startDate[1] - 1, startDate[0]);
var endDate = $("#CarRental_end_date").val().split("/");
var end_date = new Date(endDate[2], endDate[1] - 1, endDate[0]);
var days = (end_date - begin_date) / (1000*60*60*24);
$("#CarRental_rentDays").val(days+1);
}',
),
'htmlOptions' => array(
'style' => 'width:105px;vertical-align:top;font-size:0.9em;'
),
));
?>
<?php
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'model'=>$carRental,
// 'value' =>($carRental->end_date)?$carRental->begin_date:date('d/m/Y', strtotime("+1 day")),
'attribute'=>'end_date',
'options'=>array(
'showAnim'=>'fold',
'dateFormat'=>'dd/mm/yy',
'changeYear' => 'true', // แสดง Dropdown เลือกปี
'changeMonth' => 'true', // แสดง Dropdown เลือกเดือน
'onSelect'=> 'js:function(selectedDate) {
$("#CarRental_end_date").val(selectedDate); // Why do you need this?
var startDate = $("#CarRental_begin_date").val().split("/");
var endDate = $("#CarRental_end_date").val().split("/");
var begin_date = new Date(startDate[2], startDate[1] - 1, startDate[0]);
var end_date = new Date(endDate[2], endDate[1] - 1, endDate[0]);
var days = (end_date - begin_date) / (1000*60*60*24);
$("#CarRental_rentDays").val(days+1);
}',
),
'htmlOptions'=>array(
'style'=>'width:105px;vertical-align:top;font-size:0.9em;'
),
)); ?>