Question

我的数据库中存有日期，我希望与日历元素进行比较以更改日期的背景颜色

{
  "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中使用变量，在白天单击它是否有效

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中返回“undefined”

Answer 1

date是moment.js日期对象。您可以将添加参数与format方法进行比较，如：

date.format("YYYY-MM-DD") == valores[i]

Answer 2

我能够解决它，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");
    }
       });

      }

      })

如何比较完整日历中的日期

2 个答案: