JQuery 和 ajax 中的插件 datetimepicker 出错

Question

我尝试这样做，禁用所有日期并启用我通过参数传递的日期

此代码无效

$.ajax({
    method: "GET",
    url: "url",
})
.success(function(msg) {
    console.log(JSON.parse(msg));
    var disableIni = JSON.parse(msg);

    var disable = [];

    for (var i = 0; i < disableIni.length; i++)
    {
        disable[i] = moment(disableIni[i][0] + "/" + disableIni[i][1] + "/" + disableIni[i][2], "M/DD/YYYY");
        if (i > 5)
        {
            break;
        }
    }

    console.log(disable);

    var vectorTest = [moment("5/25/2017", "M/DD/YYYY"), moment("5/26/2017", "M/DD/YYYY"), moment("5/27/2017", "M/DD/YYYY")];

    console.log(vectorTest);

    var vector = disable;
    console.log(vector);

    $('#input_from').datetimepicker({
        locale: 'es',
        format: 'DD-MM-YYYY',
        enabledDates: $.each(vector, function(i, value) {
            return value;
        })
    });
});

但如果我将 var vector = disable 更改为 var vector = vectorTest，则工作正常：

$.ajax({
    method: "GET",
    url: "url",
})
.success(function(msg) {
    console.log(JSON.parse(msg));
    var disableIni = JSON.parse(msg);

    var disable = [];

    for (var i = 0; i < disableIni.length; i++)
    {
        disable[i] = moment(disableIni[i][0] + "/" + disableIni[i][1] + "/" + disableIni[i][2], "M/DD/YYYY");
        if (i > 5)
        {
            break;
        }
    }

    console.log(disable);

    var vectorTest = [moment("5/25/2017", "M/DD/YYYY"), moment("5/26/2017", "M/DD/YYYY"), moment("5/27/2017", "M/DD/YYYY")];

    console.log(vectorTest);

    var vector = vectorTest;
    console.log(vector);

    $('#input_from').datetimepicker({
        locale: 'es',
        format: 'DD-MM-YYYY',
        enabledDates: $.each(vector, function(i, value) {
            return value;
        })
    });
});

我想要的有可能吗？？

编辑

ajax 响应：

这是一个数组，其中包含其他具有 3 个位置的数组。 [0] => 月，[1] => 日，[2] => 年

谢谢

Answer 1

您可以执行以下操作：

$.ajax({
  method: "GET",
  url: "url",
  dataType: "json",
  success: function(response){
    var disable = [];
    for(var i=0; i<response.length; i++){
      var data = response[i];
      disable.push( moment([ data[2], data[0], data[1] ]) );
    }

    $('#input_from').datetimepicker({
      locale: 'es',
      format: 'DD-MM-YYYY',
      enabledDates: disable
    });
  }
});

您可以使用 jQuery.ajax 的 success 和 dataType 键。

然后你可以循环你的结果并使用日期时间选择器的 moment(Array) method and pass it to enabledDates 选项构建一个矩对象数组。

Answer 2

您可以使用 beforeShowDay，该函数将日期作为参数并且必须 return 一个包含以下内容的数组：

[0]: true/false 表示这个日期是否可选
[1]（可选）：要添加到日期单元格的 CSS class 名称或默认显示的 ""
[2]（可选）：此日期的弹出工具提示

该函数在日期选择器中的每一天被调用之前显示。

请看以下内容：

var availableDates = [[2017,6,1],[2017,6,2],[2017,6,5]];

function available(date) {
  t = [date.getDate(),(date.getMonth()+1),date.getFullYear()];
  var result = $.grep(availableDates, function(v,i) {
    return v[0]===t[2] && v[1]===t[1] && v[2]===t[0];
  }).length > 0;
  return [result];
}

$('#date').datepicker({ beforeShowDay: available });

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<p>Date: <input type="text" name="date" id="date" readonly="readonly" size="12" />

在上面的代码中，您可以通过修改布尔条件从 enabled/disabled 切换：

length > 0 而不是 length == 0

希望对你有帮助，再见

JQuery 和 ajax 中的插件 datetimepicker 出错

Error with plugin datetimepicker in JQuery with ajax

jquery

datetimepicker

bootstrap-datetimepicker

eonasdan-datetimepicker