jquery डेटाटाइम पिकर सेट minDate गतिशील

Question

मैं दोस्तों मैं trentrichardson.com द्वारा एक datetimepicker का उपयोग कर रहा हूँ।

मैं दो इनपुट क्षेत्रों के साथ एक फार्म है: और से करने के लिए और मैं गतिशील रूप से मेरी "को" क्षेत्र मेरे क्षेत्र "से" के मूल्य के बराबर करने के लिए एक minDate सेट करने में सक्षम होना चाहता हूँ।

मुझे पता है कि मुझे एक beforShow विकल्प का उपयोग करना चाहिए, लेकिन यह नहीं पता कि फ़ंक्शन को कैसे कार्यान्वित किया जाए।

$('.from,.to').datetimepicker({ 

    beforeShow: customRange 

}); 

संपादित/समाधान

function customRange(input) { 
if (input.id == 'to') {  
var x=$('#from').datepicker("getDate"); 
$(".to").datepicker("option", "minDate",x); 
} 
else if (input.id == 'from') {  
var x=$('#to').datepicker("getDate"); 
$(".from").datepicker("option", "maxDate",x); 
} } 

Answer 1

आप सेट और सेटर और गेटर के साथ गतिशील रूप minDate प्राप्त कर सकते हैं:

//getter 
var minDate = $(".selector").datepicker("option", "minDate"); 
//setter 
$(".selector").datepicker("option", "minDate", new Date(2007, 1 - 1, 1)); 

explained here

Answer 2

आप restrict the datepicker range कर सकते हैं।

लेकिन आप इस सीमा को "से" पर डेटपिकर के निर्माण पर सेट करना चाहते हैं। मैं made you a demo जो ठीक से काम करता है ठीक है, जहां तक ​​मैं सवाल समझता हूं।

Answer 3

trentrichardson.com पर example है। वे "ऑन चयन" का उपयोग कर रहे हैं। मेरे लिए यह परफर्ट काम नहीं कर रहा है। मिनीडेट या मैक्सडेट को सेट करते समय समय घटक 0 पर सेट होता है और केवल दिनांक ही रहता है। और मुझे कुछ स्थानीयकरण समस्याओं को हल करना पड़ा।

Answer 4

लुका: अपने जवाब देने के लिए एक छोटा सा अतिरिक्त ...

समारोह आप समय घटक सुझाव का प्रयोग पहली बार DateTimePicker प्रदर्शित किया जाता है नजरअंदाज कर दिया है। यदि आप डेटीमपिकर को बंद करते हैं और फिर से दोबारा खोलते हैं, तो टाइम घटक रहस्यमय रूप से फिर से दिखाई देता है। मैं काफी यकीन है कि यह क्या हो रहा है नहीं कर रहा हूँ, लेकिन यह एक हैक का एक सा के साथ ठीक किया जा सकता:

function setMinMaxDate (element) 
{ 
    // Store current date - setting max/min date seems to destroy time component 
    var val = $(element).val(); 

    if (element.id == 'endDate') 
    {  
     var x=$('#startDate').datetimepicker("getDate"); 
     $(element).datetimepicker("option", "minDate",x); 
    } 
    else if (element.id == 'startDate') 
    {  
     var x=$('#endDate').datetimepicker("getDate"); 
     $(element).datetimepicker("option", "maxDate",x); 
    } 

    // Restore date 
    $(element).val(val); 
} 

Answer 5

आप इसी आईडी from और to के साथ दो बक्सें है और आप to की minDate चाहते होने के लिए तो from की चुनी हुई तिथि फिर निम्न कार्य करें:

$("#from").datepicker({ 
    minDate: 0, // to disable past dates (skip if not needed) 
    onClose: function(selectedDate) { 
     // Set the minDate of 'to' as the selectedDate of 'from' 
     $("#to").datepicker("option", "minDate", selectedDate); 
    } 
}); 

$("#to").datepicker(); 

Answer 6

ऊपर जवाब में से कोई भी मुझे बिल्कुल भी मदद की। यह या तो काम नहीं किया या किसी तरह की त्रुटि दी।

तो मैंने उन सभी को एक साथ मिला दिया और अपना खुद का बना दिया। मैंने उपरोक्त वर्णित moment.js का उपयोग किया है, बस इसे डाउनलोड करें और इसे अपने पृष्ठ में शामिल करें।

$("#start_date").datetimepicker({ 
    format: 'Y-m-d H:00:00', 
    onChangeDateTime: function(dp, $input){ 
     var dt2 = $('#end_date'); 
     var minDate = $('#start_date').val(); 
     var currentDate = new Date(); 
     var targetDate = moment(minDate).toDate(); 
     var dateDifference = currentDate - targetDate; 
     var minLimitDate = moment(dateDifference).format('YYYY/MM/DD'); 
     var endDate = moment(dt2.val()).toDate(); 
     if((currentDate - endDate) >= (currentDate - targetDate)) 
      dt2.datetimepicker({ 
       'value': minDate 
      }); 
     dt2.datetimepicker({ 
      'minDate': '-'+minLimitDate 
     }); 
    } 
}); 
$("#end_date").datetimepicker({ 
    format: 'Y-m-d H:00:00' 
}); 

मुझे यकीन है कि ऐसा करने का एक बेहतर तरीका है लेकिन मुझे यह नहीं मिला। तो मुझे उम्मीद है कि यह भविष्य में किसी की मदद करेगा।