2016-11-25 72 views
0

最近我使用jQuery timepicker附加組件。
我效仿的榜樣創建時間選擇器
(在下面的鏈接,第4例)
http://trentrichardson.com/examples/timepicker/#range_examplesjQuery ui timepicker附加組件 - 範圍問題

我已經創建日期範圍選擇器,這樣

var startDateTextBox = $('#date_start'); 
var endDateTextBox = $('#date_end'); 

$.timepicker.dateRange(
    startDateTextBox, 
    endDateTextBox, 
    { 
     dateFormat: "yy-mm-dd", 
     minInterval: 0, 
     maxInterval: 0, 
     start: {}, // start picker options 
     end: {} // end picker options 
    } 
); 

然而,對於開始日期,它當前可以選擇日期< =結束日期。
我希望我可以選擇「任何日期」作爲開始日期。
像這個例子http://jqueryui.com/datepicker/#date-range

任何人都可以教我如何實現這與這個timepicker插件?謝謝

回答

0

這裏.on('change',function(){ })設置minDatemaxDate爲開始和結束日期。使用此fiddle

JS:

var startDateTextBox = $('#date_start'); 
var endDateTextBox = $('#date_end'); 

$(function() { 
    var dateFormat = "yy-mm-dd", 
     from = startDateTextBox.datepicker({ 
      defaultDate: "+1w", 
      changeMonth: true, 
      numberOfMonths: 3, 
      dateFormat:'yy-mm-dd' 
     }) 
     .on("change", function() { 
      to.datepicker("option", "minDate", getDate(this)); 
     }), 
     to = endDateTextBox.datepicker({ 
     defaultDate: "+1w", 
     changeMonth: true, 
     numberOfMonths: 3, 
     dateFormat:'yy-mm-dd' 
     }) 
     .on("change", function() { 
     from.datepicker("option", "maxDate", getDate(this)); 
     }); 


    function getDate(element) { 
     var date; 
     try { 
     date = $.datepicker.parseDate(dateFormat, element.value); 
     alert(date); 
     } catch(error) { 
     date = null; 
     } 
     return date; 
    } 
    }); 

HTML:

<input id="date_start"/> 
<input id="date_end"/> 
+0

看來,它只能單獨實現。感謝您的回答 – Ezek