JQuery DatePicker和BeforeShowDay [英] JQuery DatePicker and beforeShowDay
本文介绍了JQuery DatePicker和BeforeShowDay的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我拼命尝试使用此功能，只能在我的datepicker中启用特定的日期，但是从未触发 beforeShowDay 函数：（
即使这不工作：
$（document）.ready（function（）{
/ * initializing des composants * /
initComponent（）;
}）;
availableDates = new Array（）;
/ * Fonction d'initialization des composants * /
function initComponent（）{
/ * Date retrait * /
$（＃dateRetrait）。
$（＃dateRetrait）。datepicker（{beforeShowDay：function（d）{
console.log（bsd）;
alert（bsd）;
}}）;
//$(\"#dateRetrait\").datepicker({buttonImage：../../../Images/boutons/btn_calendier.png} ）;
//$(\"#dateRetrait\").datepicker({showButtonPanel：true}）;
//$(\"#dateRetrait\").datepicker({beforeShow：function（）{setTimeout function（）{$（。ui-datepicker）。css（z-index，9999999999）;}，10）;}}）;
$（'＃comboLieux'）。attr（'disabled'，'disabled'）;
$（'＃comboCreneau'）。attr（'disabled'，'disabled'）;
$（'＃dateRetrait'）。attr（'disabled'，'disabled'）;
$（'＃dateRetrait'）datepicker（'option'，'minDate'，new Date（））;
$（＃dateRetrait）。datepicker（option，dateFormat，dd-mm-yy）;
}
如果您有任何想法，我将非常感谢！
事实上，即使这不工作：
< html lang = en>
< head>
< meta charset =utf-8/>
< title> jQuery UI Datepicker - 限制日期范围< / title>
< link rel =stylesheethref =http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css/>
< script src =http://code.jquery.com/jquery-1.8.3.js>< / script>
< script src =http://code.jquery.com/ui/1.10.0/jquery-ui.js>< / script>
< link rel =stylesheethref =/ resources / demos / style.css/>
< script>
$（function（）{
$（#datepicker）.datepicker（{minDate：-20，maxDate：+ 1M + 10D}）;
$（#datepicker ）.datepicker（{beforeShowDay：function（d）{
console.log（d）;
alert（d）;
}}）;
}）;
< / script>
< / head>
< body>
< p>日期：< input type =textid =datepicker/>< / p>
< / body>
< / html>
解决方案
根据。希望这有帮助！
I am desperately trying to use this feature to enable only specific days in my datepicker, but the beforeShowDay function is never triggered :(
even this is not working:
$(document).ready(function(){
/*initialisation des composants*/
initComponent();
});
availableDates = new Array();
/* Fonction d'initialisation des composants */
function initComponent(){
/* Date retrait */
$("#dateRetrait").datepicker();
$("#dateRetrait").datepicker({beforeShowDay: function(d) {
console.log("bsd");
alert("bsd");
}});
//$("#dateRetrait").datepicker({buttonImage: "../../../Images/boutons/btn_calendier.png"});
//$("#dateRetrait").datepicker({showButtonPanel: true });
//$("#dateRetrait").datepicker({beforeShow: function() {setTimeout(function() {$(".ui-datepicker").css("z-index", 9999999999);}, 10);}});
$('#comboLieux').attr('disabled', 'disabled');
$('#comboCreneau').attr('disabled', 'disabled');
$('#dateRetrait').attr('disabled', 'disabled');
$('#dateRetrait').datepicker('option', 'minDate', new Date());
$("#dateRetrait").datepicker("option","dateFormat", 'dd-mm-yy');
}
If you have any ideas, I would greatly appreciate it!
in fact, even this is not working:
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Datepicker - Restrict date range</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<script>
$(function() {
$( "#datepicker" ).datepicker({ minDate: -20, maxDate: "+1M +10D" });
$( "#datepicker" ).datepicker({beforeShowDay: function(d) {
console.log(d);
alert(d);
}});
});
</script>
</head>
<body>
<p>Date: <input type="text" id="datepicker" /></p>
</body>
</html>
解决方案
According to jQueryUI's Datepicker API,
This explains why
$("#dateRetrait").datepicker({beforeShowDay: function(d) {
console.log("bsd");
alert("bsd");
}});
does not work.
Also I noticed you are calling .datepicker() multiple times and each time you are giving it different parameters.
Instead of:
$("#dateRetrait").datepicker();
$("#dateRetrait").datepicker({beforeShowDay: function(d) {
console.log("bsd");
alert("bsd");
}});
$('#dateRetrait').datepicker('option', 'minDate', new Date());
$("#dateRetrait").datepicker("option","dateFormat", 'dd-mm-yy');
Try doing this:
$("#dateRetrait").datepicker({
dateFormat: 'dd-mm-yy',
minDate: new Date(),
beforeShowDay: function(d) {
var dmy = (d.getMonth()+1);
if(d.getMonth()<9)
dmy="0"+dmy;
dmy+= "-";
if(d.getDate()<10) dmy+="0";
dmy+=d.getDate() + "-" + d.getFullYear();
console.log(dmy+' : '+($.inArray(dmy, availableDates)));
if ($.inArray(dmy, availableDates) != -1) {
return [true, "","Available"];
} else{
return [false,"","unAvailable"];
}
}
});
I have also provided you with a demo: http://jsfiddle.net/yTMwu/18/ . Hope this helps!
这篇关于JQuery DatePicker和BeforeShowDay的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
