格式化jQuery UI日历的问题

时间:2010-07-21 06:55:22

标签: jquery jquery-ui jquery-plugins

我遇到了格式化jQuery UI Calendar的问题。日历的格式基于用户首选项。如果用户从第一个选择框中选择日期格式,那么UI日历格式应该基于...请分享如何实现这一点的想法..提前感谢..

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 个答案:

答案 0 :(得分:2)

试试这个:

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
});