jquery日期选择器在MVC中禁用db的特定日期

时间:2014-12-23 09:30:54

标签: jquery asp.net-mvc

我想禁用从db中获取但面临问题的jquery日历中的日期。这是我的代码。

$(function () {
    getdates();
});

var unavailableDates;
function getdates() {
    $.ajax({
        type: "POST",
        url: "/DisableDates/GetDatesArray",
        data: '',
        success: function (data) {
            debugger;
            unavailableDates = data;
        },
        dataType: "json",
        traditional: true
    });
}

$("#pickdate").datepicker({
    dateFormat: 'dd-mm-yyyy',
    beforeShowDay: function (date) {
        var dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear();
        debugger;
        if ($.inArray(dmy, unavailableDates) == -1) {
            return [true, ""];
        } else {
            return [false, "myclass", "Unavailable"];
        }
    }
});

从db获取数据后,我将其保存在变量“unavailableDates”中,但是当尝试在日期选择器的“beforeShowDay”事件中查找时,其抛出错误“未定义”。

这是控制器代码

public ActionResult GetDatesArray()
{
    List<string> list = new List<string>();
    list.Add("25-12-2014");
    list.Add("26-12-2014");
    list.Add("27-12-2014");
    return Json(list.ToArray(), JsonRequestBehavior.AllowGet);
}

有什么想法吗?

2 个答案:

答案 0 :(得分:1)

<强> WORKING DEMO

将日期格式更改为dd-mm-yy而非dd-mm-yyyy

// store all unavailable date in an array
var myDate=["25-12-2014","26-12-2014","27-12-2014"]; 

$("#pickdate").datepicker({
    dateFormat: 'dd-mm-yy',  // format is yy not yyyy
    beforeShowDay: function(date){
            var string = jQuery.datepicker.formatDate('dd-mm-yy', date);
            return [ myDate.indexOf(string) == -1 ]
      }
});

答案 1 :(得分:1)

最后,设法解决了这个问题,下面的代码对我来说非常合适。

  $(function () {
    getdates();
});

var unavailableDates;
function getdates() {
    $.ajax({
        type: "POST",
        url: "/DisableDates/GetDatesArray",
        data: '',
        success: function (data) {
            debugger;
            unavailableDates = data;

            $("#pickdate").datepicker({
                dateFormat: 'dd-mm-yyyy',
                beforeShowDay: function (date) {
                    var dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear();
                    debugger;
                    if ($.inArray(dmy, unavailableDates) == -1) {
                        return [true, ""];
                    } else {
                        return [false, "myclass", "Unavailable"];
                    }
                }
            });
        },
        dataType: "json",
        traditional: true
    });
}