如何在没有白天的jquery datepicker中验证开始和结束日期。

时间:2017-01-10 05:31:59

标签: jquery html jquery-ui jquery-plugins jquery-ui-datepicker

我有两个日期选择器,只选择月份和年份。我需要验证这两个日期选择器。如果我从onedatepicker(starDate)中选择一个月和一年,比如2017年2月和所有之前的日期(如2017年1月,2016年12月,2016年11月等等)应该在seconddatepicker(endDate)中禁用。我设置了一个minValue但不起作用。

这是我的fiddle

<p>Start Date 1: <input type="text" id="startDate"></p>
<p>End Date 1: <input type="text" id="endDate"></p>

<script>
  $("#startDate").datepicker({
        changeMonth: true,
        changeYear: true,
        beforeShowDay: function (date) {
            return [''];
        },
        showButtonPanel: true,
        dateFormat: 'MM yy',
        onClose: function (dateText, inst) {
                var minValue = $(this).val();
            jQuery(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
            $("#endDate").datepicker({
              changeMonth: true,
              changeYear: true,
              beforeShowDay: function (date) {
                  return [''];
              },
              showButtonPanel: true,
              dateFormat: 'MM yy',
              minValue:minValue,
              onClose: function (dateText, inst) {
                  jQuery(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
              },
          });
        },
    });

<script>

感谢。 :)

1 个答案:

答案 0 :(得分:1)

得到了我的回答。 :)

小提琴:https://jsfiddle.net/n1gzbkru/2/

$("#startDate").datepicker({
        changeMonth: true,
        changeYear: true,
        beforeShowDay: function (date) {
            return [''];
        },
        showButtonPanel: true,
        dateFormat: 'MM yy',
        onClose: function (dateText,inst) {
            $(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
            var month = inst.selectedMonth;
            console.log(month);
            $("#endDate").datepicker({
                changeMonth: true,
                changeYear: true,
                minDate:"+"+(month+1)+"m",
                beforeShowDay: function (date) {
                    return [''];
                },
                showButtonPanel: true,
                dateFormat: 'MM yy',
                onClose: function (dateText,inst) {
                    jQuery(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
                },
            });
        },
    });