javascript - how to set minimum and maximum value of date picker in jquery? - Stack Overflow

admin管理员组

文章数量:1350912

I am using jquery date picker .I want to set max and minimum value of calendar ? how to set this value Example minimum value is 1990 and maximum is 2050

 $(  "#inputBirthDate" ).datepicker({
  changeMonth: true,
changeYear: true
});

<input class="span6 date_h nativedatepicker" id="inputBirthDate" type="text" style="pointer-event:none; width:240px;" readonly> 

I am using jquery date picker .I want to set max and minimum value of calendar ? how to set this value Example minimum value is 1990 and maximum is 2050

 $(  "#inputBirthDate" ).datepicker({
  changeMonth: true,
changeYear: true
});

<input class="span6 date_h nativedatepicker" id="inputBirthDate" type="text" style="pointer-event:none; width:240px;" readonly> 

• javascript
• jquery

Share Improve this question Follow asked Oct 8, 2013 at 6:17 user2075328user2075328 44133 gold badges77 silver badges1616 bronze badges 1

• 4 Have you even goggled it, there are lot of question with this problem already answered. you will get your answer from there. :) – Vinay Pratap Singh Bhadauria Commented Oct 8, 2013 at 6:20

Add a ment  | 

7 Answers 7

Sorted by: Reset to default 3

You need to use min-date and max-date option to set the min and max selectable date.

$("#inputBirthDate").datepicker({
    changeMonth: true,
    changeYear: true,
    minDate: new Date(2007, 1 - 1, 1),
    maxDate: new Date(2012, 1 - 1, 1),
});

Try this

$("#inputBirthDate" ).datepicker( { minDate: -0, maxDate: new Date(2020, 1,18) });

Min Date

Max Date

Plz read the documentation before going to use it: Link

   $(function() {
        $( "#datepicker" ).datepicker({ minDate: -20, maxDate: "+1M +10D" });
      });

try it..

<script>
$(function(){
    $( "#from" ).datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 3,
        onClose: function() {
            var date = $(this).datepicker('getDate');
            if (date){
                date.setDate(date.getDate() + 1);
                $( "#to" ).datepicker( "option", "minDate", date );
            }
        }
    });
    $( "#to" ).datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 3,
        onClose: function() {
            var date = $(this).datepicker('getDate');
            if (date) {
                date.setDate(date.getDate() - 1);
                $( "#from" ).datepicker( "option", "maxDate", date );
            }
        }
    });
})

just use minDate / maxDate attribute like this:

$( "#datepicker" ).datepicker({ 
    minDate: 'some value',
    maxDate: 'some other value',
});

try :

   $('#datepicker').datepicker({
        dateFormat: 'yy-mm-dd',
        changeMonth: true,
        changeYear: true,
        minDate: new Date(1990-01-01),
        maxDate: new Date(2050-01-01),
        inline: true
    });

this one worked for me, with date format

$( "#from_date" ).datepicker({
    defaultDate: "+1w",
    changeMonth: true,
    numberOfMonths: 1,
    dateFormat: 'dd/mm/yy',
    onClose: function() {
        var date = $(this).datepicker('getDate');
        if (date){
            date.setDate(date.getDate() + 1);
            $( "#to_date" ).datepicker( "option", "minDate", date );
        }
    }
});

$( "#to_date" ).datepicker({
    defaultDate: "+1w",
    changeMonth: true,
    numberOfMonths: 1,
    dateFormat: 'dd/mm/yy',
    onClose: function() {
        var date = $(this).datepicker('getDate');
        if (date) {
            date.setDate(date.getDate() - 1);
            $( "#from_date" ).datepicker( "option", "maxDate", date );
        }
    }
});

本文标签： javascripthow to set minimum and maximum value of date picker in jqueryStack Overflow