jQuery UI Datepicker maxDate विकल्प के लिए मैन्युअल दिनांक प्रविष्टि सत्यापन

Question

मेरे पास उस पृष्ठ पर jQuery डेटपिकर है जिसे दिनांक की मैन्युअल प्रविष्टि की अनुमति देने की आवश्यकता है, लेकिन यह सत्यापित करने की भी आवश्यकता है कि तिथि एक दिन से अधिक नहीं है। पिकर नियंत्रण अधिकतमडेट के माध्यम से सीमित कर दिया गया है, लेकिन जब कोई मैन्युअल रूप से दिनांक में प्रवेश करता है, तो वे एक दिन से अधिक दिन एक तिथि दर्ज कर सकते हैं। एक (मुझे) कैसे रोकता है? यहां मेरे पास अब तक है:

$(".datepicker").attr("placeholder", "mm-dd-yyyy").datepicker({ 
    showOn: "button", 
    maxDate: "+1", 
    showOtherMonths: true 
}); 

Answer 1

खैर, इसके बाद के संस्करण जवाब सही है, लेकिन यह प्रपत्र को मान्य नहीं करता, तब भी उपयोगकर्ता प्रपत्र प्रस्तुत करने में सक्षम हो जाएगा,

मैंने कुछ शोध किए हैं, लेकिन मुझे नहीं मिल सका, आखिर में मैंने यह फ़ंक्शन लिखा जो ठीक काम करता है और फॉर्म को मान्य करता है, और सही तिथि दर्ज होने तक फॉर्म सबमिट नहीं करता है, उम्मीद है कि इससे मदद मिलती है!

केवल एक चीज जो आपको करने की ज़रूरत है वह इस कोड को जोड़ना है, और फिर यह 'datePicker' वर्ग वाले सभी फ़ील्ड पर लागू होगा।

$(".datePicker").datepicker({ 
      dateFormat: 'd/mm/yy', 
      changeMonth: true, 
      changeYear: true, 
      firstDay: 1, 
      minDate: Date.parse("1900-01-01"), 
      maxDate: Date.parse("2100-01-01"), 
      yearRange: "c-90:c+150" 
     }); 

     // validation in case user types the date out of valid range from keyboard : To fix the bug with out of range date time while saving in sql 
     $(function() { 
      $.validator.addMethod(
       "date", 
       function (value, element) { 

        var minDate = Date.parse("1900-01-01"); 
        var maxDate = Date.parse("2100-01-01"); 
        var valueEntered = Date.parse(value); 

        if (valueEntered < minDate || valueEntered > maxDate) { 
         return false; 
        } 
        return !/Invalid|NaN/.test(new Date(minDate)); 
       }, 
       "Please enter a valid date!" 
      ); 
     }); 

Answer 2

मुझे यकीन नहीं है कि क्या डेटपिकर किसी ईवेंट को सक्रिय करता है यदि नियंत्रण का मूल्य सीधे टाइप करके बदल जाता है। आप .change() घटना के लिए एक समारोह के लिए बाध्य कर सकते हैं:

$(".datepicker").attr("placeholder", "mm-dd-yyyy").datepicker({ 
    dateFormat: "mm-dd-yy",     // since you have defined a mask 
    maxDate: "+1", 
    showOn: "button", 
    showOtherMonths: true 

}).on("change", function(e) { 
    var curDate = $(this).datepicker("getDate"); 
    var maxDate = new Date(); 
    maxDate.setDate(maxDate.getDate() + 1); // add one day 
    maxDate.setHours(0, 0, 0, 0);   // clear time portion for correct results 
    if (curDate > maxDate) { 
     alert("Invalid date"); 
     $(this).datepicker("setDate", maxDate); 
    } 
}); 

Demo here

Answer 3

एक विकल्प मैन्युअल रूप से इनपुट फ़ील्ड readonly बनाकर कोई दिनांक दर्ज करने की क्षमता को दूर करने के लिए है। यह उपयोगकर्ता को पागलपन से मैन्युअल रूप से प्रवेश करने से रोक देगा, और डेटपिकर के उपयोग को मजबूर करेगा।

Answer 4

मैं बिल्कुल वैसा ही आवश्यकता थी और यहाँ समाधान है कि एक आकर्षण की तरह मेरे लिए काम किया है:

$(".datepicker").attr("placeholder", "mm-dd-yyyy").change(function(){ 
    $(this).datepicker('setDate', $(this).datepicker('getDate')); 
    }).datepicker({ 
     showOn: "button", 
     maxDate: "+1", 
     showOtherMonths: true 
    }); 

संशोधित बेला here सलमान एक के answer

से संदर्भित