toli
(Tolisoft)
August 18, 2012, 9:14am
1
Hello Colleagues,
I found a strange issue whet 2 instances of zii.widgets.jui.CJuiDatePicker are used in one page.
The code is:
<td>
<?php
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'name'=>'arrival',
'value' =>(isset($_GET["arrival"])? $_GET["arrival"]: date("d-m-Y", mktime()+60*60*24)),
'language' => Yii::app()->language,
'options'=>array(
'showAnim'=>'fold',
'dateFormat' => "dd-mm-yy",
'defaultDate' => "+1d",
'changeMonth' => true,
'changeYear' => true,
'yearRange' => "2012:2015",
),
'htmlOptions'=>array(
'style'=>'width:80px;'
),
));
?>
</td>
<td>
<?php
$this->widget('zii.widgets.jui.CJuiDatePicker', array(
'name'=>'departure',
'value' =>(isset($_GET["departure"])? $_GET["departure"]: date("d-m-Y", mktime()+60*60*24*<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/cool.gif' class='bbc_emoticon' alt='8)' />),
'language' => Yii::app()->language,
'options'=>array(
'showAnim'=>'fold',
'dateFormat' => "dd-mm-yy",
'defaultDate' => "+8d",
'changeMonth' => true,
'changeYear' => true,
'yearRange' => "2012:2015",
),
'htmlOptions'=>array(
'style'=>'width:80px;'
),
));
?>
</td>
The issue:
If I click on the first field first calendar is displayed. After than I click in the second datepicker field without click on a day from first calendar. After a second click I expected to see second calendar displayed and do not expect to see first one even so there is no one calendar displayed.
Is there any way to have more than 1 full functional CJuiDatePicker at the same page?
Thanks in advance
xtan
(Relations Team)
August 18, 2012, 9:38am
2
I think this is a JUI bug. I’ve tried this with 2 JUI datepickers and the result was, as you described. The solution that I came up with was, to destroy the other datepicker, when a field is focused and initialize a datepicker for currently focused field.
abennouna
(Abennouna)
August 18, 2012, 10:41am
3
Same here, I ended up telling customers to live with it. I haven’t searched for a solution though.
@xtan , I should try your method
toli
(Tolisoft)
August 18, 2012, 11:07am
4
xtan:
I think this is a JUI bug. I’ve tried this with 2 JUI datepickers and the result was, as you described. The solution that I came up with was, to destroy the other datepicker, when a field is focused and initialize a datepicker for currently focused field.
Can you give an example how you destroy the first and enable the second?
abennouna
(Abennouna)
August 18, 2012, 11:38am
5
Hmm look at http://jqueryui.com/demos/datepicker/#date-range it works without any problem there.
That’s weird…
toli
(Tolisoft)
August 18, 2012, 12:12pm
6
I am not sure but it might be a newer version of jui?
abennouna
(Abennouna)
August 18, 2012, 3:11pm
7
No. I just tested, my standard datepickers have these settings. Removing all of them resolved the problem. Now I have to filter down to the culprit property / settings.
'showAnim' => 'fold',
'showOn' => 'both',
'buttonText' => Yii::t('app', 'Display calendar'),
'buttonImage' => Yii::app()->request->baseUrl . '/images/calendar.png',
'buttonImageOnly' => false,
'changeMonth' => true,
'changeYear' => true,
'showButtonPanel' => true,
'autoSize' => false,
'yearRange' => '1990:2020',
'maxDate' => '-1'
abennouna
(Abennouna)
August 18, 2012, 3:14pm
8
Hey guess what? It was the easiest debugging ever It was the first setting.
So removing
'showAnim' => 'fold',
solved my problem.
Not sure why though
abennouna
(Abennouna)
August 18, 2012, 3:25pm
9
I think it’s safer to avoid animations at all with datepicker.
See this open issue:
http://bugs.jqueryui.com/ticket/8393
toli
(Tolisoft)
August 19, 2012, 9:29am
10
Bennouna president!
You found it!
Thanks mate!
Now it works in my project.