Help in CJUIDatepicker

Yii 1.1 General Discussion
1

Hi,

Get stuck.

I have tried every but but it does not change the minDate when we change the start date.

It works fine on first time when I set the start date but when I change the start date again, it does not set minDate.

Any help?

Code is here





<div class="row">

<?php Yii::import('application.extensions.CJuiDateTimePicker.CJuiDateTimePicker');

    $this->widget('CJuiDateTimePicker',array(

        'model'=>$model, //Model object

        'attribute'=>'start_date', //attribute name

        'mode'=>'datetime', //use "time","date" or "datetime" (default)

        'language'=>'en_us',

        'options'=>array(

            'regional'=>'en_us',

            'timeFormat'=>'hh:mm:ss',

            'minDate'=>'new Date()',

            'onSelect'=>'js:function(dateText, inst){

                                

                 enableEndDate(dateText);

                        }'

        ) // jquery plugin options

    ));

?>

	</div>

<div class="row">

    <?php echo $form->textField($model,'end_date'); ?>

    	</div>        

        <script language="javascript">

    

  

            function enableEndDate(dateText){

                

        $("#<?php echo Chtml::activeId($model,'end_date');?>").val("");

        var end_date=$("#<?php echo Chtml::activeId($model,'end_date');?>"); 

        var sDate=dateText.split(' ');

        var sDate=sDate[0].split('/');

       var year=sDate[0];

       var month=sDate[1];

       var day=sDate[2];

   

     var nyear=Number(year)+Number(1000);

        

        end_date.datetimepicker({           

            timeFormat: 'hh:mm:ss',

            minDate: new Date(year,month,day),

            maxDate: new Date(nyear,month,day)

        });

   




       

        

        }

        </script>
2

Hi Pero…

When I don’t want users to select dates less than current I just do: ‘minDate’=>‘0’

Then, if you wish to set new date use this:




end_date.datetimepicker('setDate', new Date(year,month,day)).datetimepicker('minDate',new Date(year,month,day));

Cheers

3

This is how I set min date time




<?php                    

$this->widget('CJuiDateTimePicker',array(

	'language'=>'',

	'model'=>$model, 				// Model object

	'attribute'=>'start_date_time', // Attribute name//'minDate'=>date('Y-m-d'),  'hourMin' => (int)date('h')

	'mode'=>'datetime', 			// Use "time","date" or "datetime" (default)

	'options'=>array('dateFormat'=>'yy-mm-dd', 'hourGrid'=>5, 'minuteGrid'=>10, 'minDateTime'=>'js:new Date(' . date('Y,m-1,d,H,i') . ')'), 			// jquery plugin options

	'htmlOptions'=>array('readonly'=>true), // HTML options

));                             

?>
4

First of all, thanks for your response.

I think I am unable to explain it batter.

The problem is

When I click on start date, I select the date , for example, 2011/10/22 00:00:00.

This will sets the minDate of end_date to 2011/10/22 without any error.

But when I click again on the start date and change it to 2011/10/23 00:00:00

then the midDate for end_date remains 2011/10/22 and does not set to 2011/10/23.

Hope this will help you to understand the issue.

5

Dear Pero…

The problem is that your function enableEndDate it creates the datetimepicker first calls and then it calls it again to set new datetimepicker… You need to create the end datetimepicker first… and then use what i said in previous comments

Change your onselect this way:




// to create the datetimepicker place it in CClientScript::POS_READY for example

$("#'.Chtml::activeId($model,'end_date').'").datetimepicker({

		timeFormat: 'hh:mm',

		minDate: 0,

		hour: 20,

		minute: 00,

		showOn: "button",

		buttonImage: "images/style1/calendar.png",

		buttonImageOnly: true,

		buttonText: "choose"

	}).datepicker('setDate',(new Date())).keypress(function(){return false;});


//

// if you wish to use the widget then change your onSelect

       'onSelect'=>'js:function(dateText, inst){

                         var _dt = new Date(inst.selectedYear, inst.selectedMonth, inst.selectedDay);


                         $("#'.Chtml::activeId($model,'end_date').'").datepicker("setDate",_dt).datepicker("minDate",_dt);

                    }'

		

	}

Hope it helps

6

Hi Antonio ,

Could you please help that how could a set a past dates disable in this date picker.

Can you give me some idea about it…

thanks in advance. i am waiting for your kind reply. :)

7

To disable past dates from specified date time you need to set minDate attribute




// for example

$('#datePickerId').datepicker({minDate: '0'});
8

Well thanks antonio :) .after little bit searching on this i got the same solution.

really a lot of thanks for your quick reply.

9

Thanks antonio …

10

Just simple brother

in _form.php


<div class="input_slide">

        <?php echo $form->labelEx($model, 'date_of_joining'); ?>

        <?php

        $this->widget('zii.widgets.jui.CJuiDatePicker', array(

            'id' => 'publishDate',

            'model' => $model,

            'attribute' => 'date_of_joining',

            'options' => array(

                'showAnim' => 'fold',

            ),

        ));

        ?>

        <?php echo $form->error($model, 'date_of_joining'); ?>             

    </div>


<script language="javascript" type="text/javascript">

    $(document).ready(function(){

       	$("#publishDate").datepicker({ maxDate: new Date, minDate: new Date(2010, 7, 12) });

		

    });

</script>