禁用日期选择器中下拉列表中的日期
本文关键字:日期 下拉列表 选择器 | 更新日期: 2023-09-27 18:04:20
我有一个包含日期的下拉列表。我可以在jquery中迭代日期。但我也有一个日期选择器,我想在日期选择器中禁用下拉列表中的日期。
dropdownlist的id为:#form_one3。
javascript是这样的:
inp.datepicker({
dateFormat: dateFormat,
changeMonth: true,
beforeShowDay: function(date) {
$("#form_one3 > option").each(function() {
//alert(this.text);
var array = [this.Text].toString();
alert(array.toString());
var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
return [array.indexOf(string) == -1];
});
},
changeYear: false,
showWeek: true,
firstDay: 1,
yearRange: "c-100:c+15",
showOn: inp.hasClass("ui-date-picker-onfocus") ? "focus" : "button"
})
如果我这样做:
$("#form_one3 > option").each(function() {
alert(this.text);
});
我从下拉列表中看到所有日期。
但是完整的javascript文件只给出空值,并且datePicker不再工作。
谢谢
如果我在beforeShowDay: function (date) {
之间执行$("#form_one3 > option:gt(1)").each(function () {
DatePicker不再工作。
那么把每个函数放在哪里,这样Datepicker就可以工作了。
谢谢
格式如下:
<option value="2015-07-27T00:00:00Z">27-7-2015</option>
我现在有这样的:
inp.datepicker({
dateFormat: dateFormat,
beforeShowDay: function (date) {
$("#form_one3 > option:gt(1)").each(function () {
var array = [this.Text].toString("yy-mm-dd");
var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
return [array.indexOf(string) == -1];
});
},
changeMonth: true,
changeYear: false,
showWeek: true,
firstDay: 1,
yearRange: "c-100:c+15",
showOn: inp.hasClass("ui-date-picker-onfocus") ? "focus" : "button"
})
但我得到了这个错误:
错误:无法获取未定义或空引用的属性"0">
如果我调试,我每次都会看到:
return[array.indexOf(string(==-1];
字符串为:2015年6月29日。
这是完整的脚本:
; (function ($) {
$(function () {
$("form.xforms-form").bind({
XForms_Enrich: function (e) {
if ($.fn.datepicker) {
$("input.qmatic-dateslot", e.args.data).each(function () {
var inp = $(this);
if (inp.is(":disabled")) return;
var tabindex = inp.attr("tabindex");
var dateFormat = $.xforms.getProperty(inp, 'dateFormat') || 'd-M-yy';
dateFormat = dateFormat.replace(/m/g, '0').replace(/h/gi, '0').replace(/t/g, '').replace(/M/g, 'm').replace('yyyy', 'yy');
$("#" + inp.attr("id") + " ~ button.ui-datepicker-trigger").attr("tabindex", tabindex);
var clearBtn = $('<button class="ui-datepicker-clear" type="button" tabindex="' + tabindex + '">x</button>').click(function () { inp.val(''); inp.change(); return false; });
inp.after(clearBtn);
inp.datepicker({
dateFormat: dateFormat,
beforeShowDay: function (date) {
$("#form_one3 > option:gt(0)").each(function () {
//alert(this.text + ' ' + this.value);
//var array = ["2015-03-14", "2015-03-15", "2015-03-16"];This works :)
var array = [this.Text].toString("yy-mm-dd");
var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
return [array.indexOf(string) == -1];
});
},
changeMonth: true,
changeYear: true,
showWeek: true,
firstDay: 1,
yearRange: "c-100:c+15",
showOn: inp.hasClass("ui-date-picker-onfocus") ? "focus" : "button"
})
});
$("#ui-datepicker-div").hide();
}
}
})
})
})(jQuery);
它在以下线路中断:
unselectable = (otherMonth && !selectOtherMonths) || !daySettings[0] ||
(minDate && printDate < minDate) || (maxDate && printDate > maxDate);
这就是错误:
unable to get property 0 of undefined or null reference
我也试过这样做:
inp.datepicker({
dateFormat: dateFormat,
beforeShowDay: function (date) {
$("#form_one3 > option:gt(0)").each(function (key, value) {
if (date == value.toString('d-M-yy')) {
var array = [this.Text].toString("d-M-yy");
var string = jQuery.datepicker.formatDate('d-M-yy', date);
return [array.indexOf(string) == -1];
}
else {
return 0;
}
});
},
changeMonth: true,
changeYear: true,
showWeek: true,
firstDay: 1,
yearRange: "c-100:c+15",
showOn: inp.hasClass("ui-date-picker-onfocus") ? "focus" : "button"
})
我假设您的代码是基于这个相关的问题。我想你想做的是,在ShowDay之前,检查日期是否是你下拉列表中的任何日期。根据您的jQuery版本,您可以使用find((或filter((。我还认为你需要将日期的格式与选项文本的格式相同,月份或日期中没有前导零,然后是日期,然后是月份,然后是年份。
如果您使用的是jQuery>1.9:,请尝试这样的操作
beforeShowDay: function (date) {
var dateString = jQuery.datepicker.formatDate('d-m-yy', date);
return ($('#form_one3 option').filter(function () { return $(this).html() == dateString; }).length == 0);
}