自动将2周添加到Jquery UI日期选择器无法正常工作

时间:2014-11-16 16:17:11

标签: javascript jquery date

我的一个项目上有一个jquery ui日期选择器,要求我需要一次选择特定的2周块,我知道我可以让日期选择器选择2周的块但我只需要允许用户选择特定的2周块来选择某些支付期。我尝试做的只是选择工资核算周期的开始日期,然后选择从开始到结束创建2周范围后13天的日期。这是一个JSFiddle链接,我已经将工资单日的开始作为活动状态,其余部分禁用了一个显示所选日期的文本框,结束日期字段是我无法获得13天之后的日期,非常感谢任何帮助。

链接到JSFIDDLE-

http://jsfiddle.net/FuriousDuck/pxw3x8Lk/8/

HTML

<div id="date"></div>

Start Date  - <input type="text" id="start-date" value=""><br>
End Date   - <input type="text" id="end-date" value="13 Days Later Value"><br>

JAVASCRIPT

var availableDates = [
"2014-11-2",
"2014-11-16",
"2014-11-30"
];

function available(date) {
  ymd = date.getFullYear() + "-" + (date.getMonth()+1) + "-" + date.getDate();

  if ($.inArray(ymd, availableDates) != -1) {
    return [true, "","Available"];
  } else {
    return [false,"","unAvailable"];
  }





}

$('#date').datepicker(
  { 
    altField  : '#start-date',
    altFormat : 'yy-mm-dd',
    dateFormat: 'DD, d MM',
    beforeShowDay: available 
  });

1 个答案:

答案 0 :(得分:0)

在日期选择器中添加onSelect侦听器,以便在选择其他日期时运行函数:

$('#date').datepicker(
{ 
    altField  : '#start-date',
    altFormat : 'yy-mm-dd',
    dateFormat: 'DD, d MM',
    beforeShowDay: available,
    onSelect: function() {
        var selectedDate = $('#date').datepicker('getDate');
        var endDate = new Date(selectedDate);
        endDate.setDate(endDate.getDate()+14);
        var endDateStr = (endDate.getYear()+1900)+'-'+(endDate.getMonth()+1)+'-'+endDate.getDate();
        $('#end-date').val(endDateStr);
    }
})