检查日期在datepicker中是否可用

时间:2015-06-27 11:02:48

标签: jquery datepicker jquery-ui-datepicker

enter image description here

我有这样的日期选择器,根据图像选择的当前日期是02/06/2015,如果我点击" +1天"然后它应该通过错误"日期不可用",因为03/06/2015不可用或禁用。

以前有人这样做过,请建议回答。

2 个答案:

答案 0 :(得分:1)

我刚刚做了一个例子。我必须覆盖一些方法,做一些技巧。希望这有帮助。下面的演示。

$(function() {
  var beforeShowFunction = function(input, inst) {
    setTimeout(function() {
      var buttonPane = $(input).datepicker("widget")
        .find(".ui-datepicker-buttonpane");
      var btn = $('<button class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all" type="button">+</button>');
      btn.bind("click", function(e) {
        if ($(input).datepicker('getDate') == null)
          return;
        var currentDate = new Date($(input).datepicker("getDate"));
        var newDate = new Date(currentDate.setDate(currentDate.getDate() + 1));
        $(input).datepicker("setDate", newDate);
        currentDate = new Date($(input).datepicker("getDate"));
        if (currentDate.getDate() != newDate.getDate()) {
          alert('Unavailabled!');
        }
        $(input).datepicker("hide");
        $(input).datepicker("show");
      });
      btn.appendTo(buttonPane);
      var btnMinus = $('<button class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all" type="button">-</button>');
      btnMinus.bind("click", function(e) {
        if ($(input).datepicker('getDate') == null)
          return;
        var currentDate = new Date($(input).datepicker("getDate"));
        var newDate = new Date(currentDate.setDate(currentDate.getDate() - 1));
        $(input).datepicker("setDate", newDate);
        currentDate = new Date($(input).datepicker("getDate"));
        if (currentDate.getDate() != newDate.getDate()) {
          alert('Unavailabled!');
        }
        $(input).datepicker("hide");
        // force call show to see +, - buttons 
        $(input).datepicker("show");
      });
      btnMinus.appendTo(buttonPane);
    }, 1);
  };

  $("#datepicker").datepicker({
    minDate: -20,
    maxDate: "+1M +10D",
    showButtonPanel: true,
    beforeShow: beforeShowFunction,
  });
  // Below fix today button 
  jQuery.datepicker._gotoToday = function(id) {
    var target = jQuery(id);
    var inst = this._getInst(target[0]);
    if (this._get(inst, 'gotoCurrent') && inst.currentDay) {
      inst.selectedDay = inst.currentDay;
      inst.drawMonth = inst.selectedMonth = inst.currentMonth;
      inst.drawYear = inst.selectedYear = inst.currentYear;
    } else {
      var date = new Date();
      inst.selectedDay = date.getDate();
      inst.drawMonth = inst.selectedMonth = date.getMonth();
      inst.drawYear = inst.selectedYear = date.getFullYear();
      this._setDateDatepicker(target, date);
      this._selectDate(id, this._getDateDatepicker(target));
    }
    this._notifyChange(inst);
    this._adjustDate(target);
    // force call show to see +, - buttons
    $('#datepicker').datepicker("show");
  };
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="https://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<script src="https://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>

<input type="text" id="datepicker" />
<br />

答案 1 :(得分:-1)

您可以检查输入日期是否为有效日期,例如:

DateTime d = new DateTime();
DateTime.TryParse("33-01-2014", out d);

你也可以加一天

d.AddDays(1);

并检查月份是否发生变化或其他......