jQuery की तारीख पिकर - पिछली तारीखों को अक्षम करें

Question

मैं एक तिथि सीमा का चयन करने की कोशिश कर रहा हूँ UI तिथि पिकर का उपयोग करते हुए।

इन / से फ़ील्ड में लोगों को वर्तमान दिन से पहले की तारीखों को देखने या चयन करने में सक्षम नहीं होना चाहिए।

यह मेरा कोड है:

$(function() {
    var dates = $( "#from, #to" ).datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1,
        onSelect: function( selectedDate ) {
            var option = this.id == "from" ? "minDate" : "maxDate",
                instance = $( this ).data( "datepicker" ),
                date = $.datepicker.parseDate(
                    instance.settings.dateFormat ||
                    $.datepicker._defaults.dateFormat,
                    selectedDate, instance.settings );
            dates.not( this ).datepicker( "option", option, date );
        }
    });
});

क्या कोई मुझे बता सकता है कि वर्तमान तारीख से पहले की तारीखों को कैसे निष्क्रिय किया जाए।

Answer 1

आपको एक नया दिनांक ऑब्जेक्ट बनाना होगा और इसे minDateतब सेट करना होगा जब आप डेटापिक्सर्स को इनिशियलाइज़ करेंगे

<label for="from">From</label> <input type="text" id="from" name="from"/> <label for="to">to</label> <input type="text" id="to" name="to"/>

var dateToday = new Date();
var dates = $("#from, #to").datepicker({
    defaultDate: "+1w",
    changeMonth: true,
    numberOfMonths: 3,
    minDate: dateToday,
    onSelect: function(selectedDate) {
        var option = this.id == "from" ? "minDate" : "maxDate",
            instance = $(this).data("datepicker"),
            date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
        dates.not(this).datepicker("option", option, date);
    }
});

संपादित करें - आपकी टिप्पणी से अब यह अपेक्षा के अनुरूप काम करता है http://jsfiddle.net/nicolapeluchetti/dAyzb1//

Comments

मैं एक ऐसा तरीका लागू करना चाहता हूं कि लोग उस तारीख को न चुन सकें, जो अतीत में हो चुकी है .. जैसे कल से पहले का दिन आदि। केवल आज से और उसके बाद।

— हर्षा एमवी

@HarshaMV मैंने अपना उत्तर अपडेट किया, आपको डेटेपर्स को इनिशियलाइज़ करते समय सिर्फ मिनिटेट सेट करना चाहिए

— निकोला पेलुचेती 12

showAnim:"",जब आप अपना चयन करते हैं, तो कष्टप्रद महीना और वर्ष बदलने के लिए आप तिथि निर्धारण सेटिंग में जोड़ सकते हैं ।

— मिस्सी

मैंने आपकी स्क्रिप्ट का उपयोग किया है, लेकिन मुझे त्रुटि मिल रही है "अनट्रीफ़र्ड रेफ़रेंस: $ परिभाषित नहीं है"। मैं इसे कैसे ठीक करूंगा?

— मेंबल जॉर्ज

@ नोइकोलापुचेती यह वही है जो मुझे चाहिए, लेकिन क्या इसे एस्प: टेक्स्टबॉक्स में इस्तेमाल किया जा सकता है? मैंने कोशिश की लेकिन इसका काम नहीं हो रहा है, क्या कोई विशिष्ट परिवर्तन है जो मुझे करना चाहिए? अग्रिम धन्यवाद

— wolfQueen

Answer 2

डेटरोड वेरिएबल को डिक्लेयर करें और इसे सेट करने के लिए डेट () फंक्शन का उपयोग करें .. फिर उस वैरिएबल का इस्तेमाल मिंटडेट को असाइन करने के लिए करें जो डेटापीकर का पैरामीटर है।

var dateToday = new Date(); 
$(function() {
    $( "#datepicker" ).datepicker({
        numberOfMonths: 3,
        showButtonPanel: true,
        minDate: dateToday
    });
});

यह बात है ... उपरोक्त उत्तर वास्तव में उपयोगी था ... इसे लोगों को बनाए रखें ..

Comments

स्पष्ट और सीधा जवाब .. धन्यवाद

— एएसडी

Answer 3

$('#datepicker-dep').datepicker({
    minDate: 0
});

minDate:0 मेरे लिये कार्य करता है।

Answer 4

जल्द से जल्द स्वीकृत तिथि को प्रतिबंधित करने के लिए "मिनीडेट" विकल्प का उपयोग करें। मान "0" का अर्थ है आज (आज से 0 दिन):

    $(document).ready(function () {
        $("#txtdate").datepicker({
            minDate: 0,
            // ...
        });
    });

डॉक्स यहां: http://api.jqueryui.com/datepicker/#option-minDate

Answer 5

बस इसे जोड़ने के लिए:

यदि आपको उपयोगकर्ता को मैन्युअल रूप से अतीत में एक तारीख टाइप करने से रोकने की आवश्यकता है , तो यह एक संभव समाधान है। यह वही है जो हमने कर दिया (@ नोइकोला पेलुचेती के जवाब पर आधारित)

var dateToday = new Date();

$("#myDatePickerInput").change(function () {
    var updatedDate = $(this).val();
    var instance = $(this).data("datepicker");
    var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, updatedDate, instance.settings);

    if (date < dateToday) {
        $(this).datepicker("setDate", dateToday);
    }
});

यह क्या करता है आज की तारीख में मूल्य को बदलना है अगर उपयोगकर्ता मैन्युअल रूप से अतीत में एक तारीख टाइप करता है।

Answer 6

लाइव डेमो , यह कोशिश करो,

    $('#from').datepicker(
     { 
        minDate: 0,
        beforeShow: function() {
        $(this).datepicker('option', 'maxDate', $('#to').val());
      }
   });
  $('#to').datepicker(
     {
        defaultDate: "+1w",
        beforeShow: function() {
        $(this).datepicker('option', 'minDate', $('#from').val());
        if ($('#from').val() === '') $(this).datepicker('option', 'minDate', 0);                             
     }
   });

Answer 7

ऐसा करने का यह आसान तरीका है

$('#datepicker').datepicker('setStartDate', new Date());

इसके अलावा, हम भविष्य के दिनों को अक्षम कर सकते हैं

$('#datepicker').datepicker('setEndDate', new Date());

Comments

धन्यवाद! आपने घंटों की हताशा को रोका।

— lmiguelvargasf

Answer 8

प्रारंभ दिनांक सेट की तारीख की विशेषता, यह काम करता है, नीचे काम कोड है

$(function(){
$('#datepicker').datepicker({
    startDate: '-0m'
    //endDate: '+2d'
}).on('changeDate', function(ev){
    $('#sDate1').text($('#datepicker').data('date'));
    $('#datepicker').datepicker('hide');
});
})

Answer 9

jQuery एपीआई प्रलेखन - datepicker

न्यूनतम चयन तिथि। जब सेट किया जाता है null, तो कोई न्यूनतम नहीं होता है।

समर्थित कई प्रकार:

दिनांक: एक दिनांक ऑब्जेक्ट जिसमें न्यूनतम दिनांक है।
संख्या: आज से कई दिन बाद। उदाहरण के लिए 2प्रतिनिधित्व करता two daysआज से और -1का प्रतिनिधित्व करता है yesterday।
स्ट्रिंग:dateFormat विकल्प द्वारा परिभाषित प्रारूप में एक स्ट्रिंग , या एक रिश्तेदार तिथि।
सापेक्ष तिथियों में मूल्य और अवधि जोड़े शामिल होने चाहिए; वैध अवधि हैं yके लिए years, mके लिए months, wके लिए weeks, और dके लिए days। उदाहरण के लिए, से +1m +7dप्रतिनिधित्व करता one month and seven daysहै today।

आज के अलावा पिछली तारीखों को प्रदर्शित नहीं करने के लिए

$('#datepicker').datepicker({minDate: 0});

Answer 10

" माइंडेट " विशेषता का उपयोग jquery datepicker में पारित तारीखों को निष्क्रिय करने के लिए किया जाना चाहिए।

minDate: new Date () या minDate: '0' इसके लिए महत्वपूर्ण है।

Ex:

$(function() {
    $( "#datepicker" ).datepicker({minDate: new Date()});
});

या

$(function() {
  $( "#datepicker" ).datepicker({minDate: 0});
});

Answer 11

बस अपना कोड बदलें:

पुराना कोड:

$("#dateSelect").datepicker({
    showOtherMonths: true,
    selectOtherMonths: true,
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    dateFormat: 'yy-mm-dd'

});

नया कोड:

$("#dateSelect").datepicker({
    showOtherMonths: true,
    selectOtherMonths: true,
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    dateFormat: 'yy-mm-dd',
    minDate: 0
});

Answer 12

व्यवस्थित करके startDate: new Date()

$('.date-picker').datepicker({
    defaultDate: "+1w",
    changeMonth: true,
    numberOfMonths: 1,
    ...
    startDate: new Date(),
});

Answer 13

मैंने पिछली तारीख को निष्क्रिय करने के लिए फ़ंक्शन बनाया है, लचीले सप्ताहांत दिनों को अक्षम करें (जैसे शनिवार, रविवार)

हम jQuery UI डेटपिकर प्लगइन के पहलेShowDay विधि का उपयोग कर रहे हैं ।

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
var NotBeforeToday = function(date) {
		var now = new Date(); //this gets the current date and time
		if (date.getFullYear() == now.getFullYear() && date.getMonth() == now.getMonth() && date.getDate() >= now.getDate() && (date.getDay() > 0 && date.getDay() < 6) )
			return [true,""];
		if (date.getFullYear() >= now.getFullYear() && date.getMonth() > now.getMonth() && (date.getDay() > 0 && date.getDay() < 6))
			return [true,""];
		if (date.getFullYear() > now.getFullYear() && (date.getDay() > 0 && date.getDay() < 6))
			return [true,""];
		return [false,""];
	}


jQuery("#datepicker").datepicker({
		beforeShowDay: NotBeforeToday
    });

यहां आज की तारीख 15 सितंबर है। मैंने शनिवार और रविवार को विकलांग कर दिया है।

Answer 14

आपको इस तरह चर में वर्तमान तिथि घोषित करनी होगी

 $(function() {
    var date = new Date();
    var currentMonth = date.getMonth();
    var currentDate = date.getDate();
    var currentYear = date.getFullYear();
    $('#datepicker').datepicker({
    minDate: new Date(currentYear, currentMonth, currentDate)
    });
})

Answer 15

$( "#date" ).datetimepicker({startDate:new Date()}).datetimepicker('update', new Date());

new Date(): फ़ंक्शन प्राप्त करें आज की तारीख पिछली तारीख लॉक हो गई है। 100% काम कर रहा है

Answer 16

आप बस उपयोग कर सकते हैं

startDate: 'today'

यह मेरे लिए ठीक काम कर रहा है।