CJuiDatePicker change maxdate/mindate Dynamically

Hi all!

I have a dropdown list, and depend on what option you choose here, a CJuiDatePicker has to change his option ‘maxDate’ dynamically.

It works perfect if my CJuiDatePicker has ‘flat’ to false (this option hide the widget before you click the input field), because there is an option called ‘beforeShow’ that executed before show the widget.




'flat'=>false,   //I want to change this to true, and show the widget as an inline calendar

'options'=>array(

                 ....

                 'beforeShow' => 'js:function(){

                      maxdate = maxDate();

                      $(this).datepicker("option","maxDate",maxdate.responseText);

                  }',

                  ...

                  )

                  

but does anybody know how can I change ‘maxDate’ if I have ‘flat’ to true? because in this case, the property ‘beforeShow’ does not work ???

Thank you very much!

According to the document of jQuery UI Datepicker, I hope something like this would do:




maxdate = maxDate();

$("your_selector_here").datepicker("option", "maxDate", maxdate.responseText);



http://jqueryui.com/demos/datepicker/#option-maxDate

thank you Softark for your answer ;)

I tried but it does not work.

I think that the error comes because the DatePicker is not ready before I run your sentence.

But also waiting until I have my date picker loaded on my web it does not work :unsure:


$("#mi_datePicker_id").load(function(){... your code ...})

You should wrap your code in a suitable jQuery event, and register it with $(document).ready();

Are you familiar with jQuery?

I think you can set the default maxDate in the usual manner, and set a new maxDate value when the user has select an item in the dropdown.




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

    'name'=>'publishDate',

    // additional javascript options for the date picker plugin

    'flat'=>true,

    'options'=>array(

        'maxDate'=>$defaultMaxDate,

    ),

    'htmlOptions'=>array(

        'style'=>'height:20px;'

    ),

));

...

$('#some_dropdown').select(function(){

    maxdate = maxDate();

    $("your_selector_here").datepicker("option", "maxDate", maxdate.responseText);

    return false;

});