Jquery日期选择器,我如何设置未来的日期
Jquery datepicker, how can I set future date
我有一个显示今天日期的文本框和一个日历图标,当单击该图标时,会打开一个选择了今天日期的日期选择器。我希望日期选择器在以后的某个日期打开,即2012年3月12日,当您单击日历图标时。
我可以在firebug-中的json响应中看到未来的日期
[{"date":"01/05/2012","available":true},{"date":"05/05/2012","available":true}]
但是,当单击日历图标时,我如何刷新/重新绘制日历以显示这些日期呢。
这是我的日期选择器
// Load the Datepicker options
$(document).ready(function(){
$('#<%= ViewData.Model.name %>_DatePickerCalendar_<%= ViewData.Model.sector %>').datepicker({
changeYear: true,
changeMonth: true,
clearText: '',
closeText: '',
currentText: '',
prevText: '«',
nextText: '»',
dateFormat: 'dd/mm/yy',
firstDay: 1,
numberOfMonths: 2,
minDate: 0,
<% if(Model.name == "Flight") { %>
maxDate: '+16m',
<% } else { %>
maxDate: new Date(<%=Model.maxDate.Year %>, <%=Model.maxDate.Month %> - 1, <%=Model.maxDate.Day %>),
<% } %>
mandatory: true,
showOn: 'both',
buttonImage: '/images/icons/ico-calendar.gif',
buttonImageOnly: true,
buttonText: 'view calendar',
changeFirstDay: false,
var date = new Date();
if (sDate.value != "")
date = $.datepicker.parseDate('dd/mm/yy', sDate.value);
cbBeforeShow(date, '<%= ViewData.Model.name %>', '<%= ViewData.Model.sector %>', '<%= ConfigurationSettings.AppSettings["FutureAvailabilityYears"]%>');
},
beforeShowDay: cbCheckDayAvailable,
onChangeMonthYear: function(year, month, inst) {
<%--/*
When displaying multiple months with a set maxDate setting, and you select the last month
datepicker shows the max month last, this causes GetAvailability to not query the correct months
changing the selected month to the previous means the correct availability is retrieved
*/--%>
if (typeof inst.settings.maxDate === "object" &&
month == (inst.settings.maxDate.getMonth() + 1) &&
year == inst.settings.maxDate.getYear()) {
month--;
}
cbChangeMonthYear(year, month, '<%= ViewData.Model.name %>', '<%= ViewData.Model.sector %>', '<%= ConfigurationSettings.AppSettings["FutureAvailabilityYears"]%>')
},
<% } else { %>
beforeShowDay: function(sDate) {
cbCheckGreaterThanDateOut('<%= ViewData.Model.name %>');
},
beforeShowDay: function() {
return [true, _gDatePickerCalendar.availDayClass ]
},
onChangeMonthYear: null,
<% } %>
onClose: function(sDate) {
cbOnClose('<%= ViewData.Model.name %>', '<%= ViewData.Model.name %>', '<%= ViewData.Model.sector %>');
},
onSelect: function(sDate) {
cbOnSelect(sDate, '<%= ViewData.Model.name %>', <%= ViewData.Model.sector %>);
},
defaultDate: new Date('15 October 2012')
});
});
在日期选择器"beforeShow"上调用的javascript是-
function cbBeforeShow(dDate, model, sector, futureAvailabilityMonths) {
_gDatePickerCalendar.GetAvailability(dDate, null, null, sector);
setTimeout('$("#ui-datepicker-div")', 800);
//checkForEmptyAvailabilityForMonth(dDate, null, null, model, sector, futureAvailabilityMonths);
$('#ui-datepicker-div').show();
}
这是GetAvailability方法中的ajax调用
$.ajax({
url: _gDatePickerCalendar.availUrl,
dataType: "json",
async: false,
success: function(data) {
$.each(data, function(i, item) {
if (item.date != "") {
var date = new Date(item.date.substring(6, 10), item.date.substring(3, 5) - 1, item.date.substring(0, 2));
_gDatePickerCalendar.availDays[i] = date;
}
});
},
complete: function() {
var dd = new Date();
alert("Just about to get a date from the array");
dd = _gDatePickerCalendar.availDays[0];
alert(dd);
}
});
很抱歉粘贴了这么多代码,但我束手无策:(
您可以通过在beforeShow
事件上调用jQueryUI Calendar的setDate
方法来实现这一点。
beforeShow: function(input, inst) {
$(this).datepicker( "setDate" , new Date('01-01-2013'));
}
工作示例:http://jsfiddle.net/7HLn7/
更新:
这些不是正确的
1,应该只是var date = new Date(item.date.substring(6, 10), item.date.substring(3, 5) - 1, item.date.substring(0, 2));
var date = new Date(item.date);
请将其从您的服务器方法传递为"yy/mm/dd"。它应该适用于美国和英国的地区。
这是什么?setTimeout('$("#ui-datepicker-div")', 800);
。setTimeout的签名为https://developer.mozilla.org/en/DOM/window.setTimeout
这个
var dd=新日期()
alert("正要从数组中获取日期")
dd=_gDatePickerCalendar.availDays[0];
这将永远无法确保dd是Date对象。C#和JavaScript中的var不同
你离这里很近,只是有点耐心:)
- 我想以时间戳的形式将日期设置为无限
- Bootstrap DatePicker-将日期设置为明天
- 为什么将新日期设置为今天会返回昨天
- 将 JavaScript 日期设置为静态
- 将日期设置为“”格式;Md、yy”;
- 将“日期”设置为Jquery UI日期选择器输入文本框
- 如何使用日期选择器将默认日期设置为从当前日期起两天
- 如何使用javascript将验证日期设置为不小于文本框中的开始日期
- 正在将日期范围选取器的开始日期设置为空
- Javascript:将新日期设置为明天上午8点
- 引导日期选择器将日期设置为1970年之前
- 如何将小时 javascript 日期设置为大于 23 并使用 .getHours() 函数检索它们
- 如何将日期设置为 72 小时后过期
- 在引导日期选取器中将日期设置为初始为空
- 如何在引导日期设置每月的第一个日期和最后一个日期
- 如何使用另一个日期输入字段将日期设置为输入字段
- 无法将昨天的日期设置为剑道UI日期选择器
- 根据特定日期设置数组
- 将“当前日期”设置为在引导日期选取器中选中
- 在 session.createDateTime 中将日期设置为特定的 d/t 和时区