Проблема с форматированием jQuery UI Calendar - PullRequest
1 голос
/ 21 июля 2010

Я застрял с проблемой форматирования jQuery UI Calendar. Формат календаря основан на предпочтениях пользователя. Если пользователь выбирает формат даты в первом поле выбора, тогда формат календаря пользовательского интерфейса должен основываться на этом ... Пожалуйста, поделитесь идеями о том, как этого добиться ... заранее спасибо ...

Код jQuery

jQuery(function() {

        var format = 'yy-mm-dd';
        jQuery('#dateFormat').change(function(){
        format = jQuery('#dateFormat').val();
        alert(format);  
        });

        jQuery('#fromDate').datepicker({
        showTime: false,
        dateFormat: format,
        showOn: 'button',buttonText: 'Date', buttonImage: 'images/calendar.gif', buttonImageOnly: true
        });

        jQuery('#toDate').datepicker({
        showTime: false,
        dateFormat: 'dd-mm-yy',
        showOn: 'button',buttonText: 'Date', buttonImage: 'images/calendar.gif', buttonImageOnly: true
        });

});

HTML-код выглядит следующим образом

<label>Date Format</label>
<select name="dateFormat" id="dateFormat">
<option val="1">dd-mm-yy</option>
<option val="2">yy-mm-dd</option>   
</select>
<label>Period start:</label>
<input type="text" value="" size="30" name="fromDate" id="fromDate" />
<label>Period start:</label>
<input type="text" value="" size="30" name="toDate" id="toDate" />

1 Ответ

2 голосов
/ 21 июля 2010

попробуйте это:

var fromDate = jQuery('#fromDate');
var toDate = jQuery('#toDate');
var dateFormat = jQuery('#dateFormat');

dateFormat.change(function(){
  var format = jQuery(this).val();
  fromDate.datepicker('option','dateFormat',format);
  toDate.datepicker('option','dateFormat',format);
});

fromDate.datepicker({
  showTime: false,
  dateFormat: format,
  showOn: 'button',buttonText: 'Date', buttonImage: 'images/calendar.gif', buttonImageOnly: true
});

toDate.datepicker({
  showTime: false,
  dateFormat: 'dd-mm-yy',
  showOn: 'button',buttonText: 'Date', buttonImage: 'images/calendar.gif', buttonImageOnly: true
});
...