![](/img/trans.png)
[英]how to customise weekend dates with differnt dates and with differnts hours in full calendar
[英]How to compare dates in full calendar
我有一个存储在数据库中的日期,我想将其与日历元素进行比较以更改日期的背景色
{
"success": true,
"disponibilidad": [
{
"slot_date": "2017-06-08"
},
{
"slot_date": "2017-06-09"
},
{
"slot_date": "2017-06-10"
},
{
"slot_date": "2017-06-11"
},
{
"slot_date": "2017-06-12"
}
]
}
我尝试使用jquery,并且它以某种方式工作,但是加载时间太慢且最优值太小,此外,如果我更改月份,则会出现着色日期的问题,我的问题是,是否存在在dayRender中传递日期数组的方法?
我使用的方法
$('#calendar').fullCalendar({
dayClick: function() {
//alert("dia presionado");
selectedDate = $(this).attr("data-date");
alert($(this).attr("data-date"));
//window.location.href="/reservation/"+selectedDate;
$('#calendar').fullCalendar('gotoDate', $(this).attr("data-date"));
},
dayRender: function(date, cell) {
$.ajax({
type: "get",
url: '/getFaq',
dataType: 'json',
success: function(data) {
var valores = [];
valores[0] = "2017-06-27";
valores[1] = "2017-06-28";
for (var i = 0; i <= 1; i++) {
if (date.format() == valores[i]) {
cell.css("background-color", "red");
}
}
},
error: function(response) {},
});
}})
*编辑
我已经使用数据属性嵌入了代码,但是由于某种原因,我无法在dayrender中使用变量,在dayclick中可以使用
success: function(data)
{
myArray= new Array(data.disponibilidad.length);
for(var i=0;i<data.disponibilidad.length;i++)
{
myArray[i]=data.disponibilidad[i].slot_date;
}
$( "body" ).data( "array",myArray);
//for(var k=0; k< myArray.length;k++)
//console.log($( "body" ).data( "array" ));
//console.log(myArray);
}
$('#calendar_make_a_reservation').fullCalendar({
height: 500,
dayClick: function() {
$('#modal_appointment_time').modal('open');
/*
var array=$( "body" ).data( "array" );
console.log(array);*/
},
dayRender: function (date, cell) {
var array=$( "body" ).data( "array" );
console.log(array);
/*
myArray.forEach(function (item) {
if (date._d.getDate() == item.getDate() && date._d.getMonth() == item.getMonth())
{
$(cell).toggleClass('selected');
}
});*/}
})
在Dayrender中返回“未定义”
date
是moment.js日期对象。 您可以将添加参数与format
方法进行比较,例如:
date.format("YYYY-MM-DD") == valores[i]
我能够解决它,dayrender的问题是由于同步造成的,一旦异步更改为false,一切都会正常运行。
$.ajax({
async:false,
cache:false,
dataType: 'json',
type: 'get',
url: 'getReservas',
data:params,
success: function(data)
{
myArray= new Array(data.disponibilidad.length);
for(var i=0;i<data.disponibilidad.length;i++)
{
myArray[i]=data.disponibilidad[i].slot_date;
}
alert("segundo");
var array=$( "body" ).data("array",myArray);
//for(var k=0; k< myArray.length;k++)
//console.log($( "body" ).data( "array" ));
//console.log(myArray);
},
error: function(data){
alert("ha ocurrido un error") ;
}
});
$('#calendar_make_a_reservation').fullCalendar({
height: 500,
dayClick: function() {
$('#modal_appointment_time').modal('open');
//console.log($( "body" ).data("array"));
},
dayRender: function (date, cell) {
myArray.forEach(function (item) {
if (date.format()==item)
{
cell.css("background-color", "blue");
}
});
}
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.