使用控制器中的结构初始化 TempusDominus datetimepicker

Question

我有一个 tempusdominus datetimepicker 和一个链接的选择器。我从控制器中获得一个由 Map> 组成的结构，其中的键是应在 datetimepicker 中启用的日期，每个日期都有一个小时列表，当用户选择日期时，我必须在链接选择中显示这些小时。我的jsp中有这个：<div class="row">     <div class="col-sm-6 labels">        <div class="form-group">            <label>Date</label>            <div class="input-group date" id="fechaCita" data-target-input="nearest">            <input type="text" class="form-control datetimepicker-input" data-target="#fechaCita"/>            <div class="input-group-append" data-target="#fechaCita" data-toggle="datetimepicker">                 <div class="input-group-text"><i class="fa fa-calendar"></i></div>            </div>        </div>    </div></div><div class="col-sm-4 labels">    <div class="form-group">        <label>Time</label>        <div class="input-group date" id="horaInicio">            <form:select path="horario.horaInicio" id="selectHoraCita" class="form-control">                <form:option value="">--</form:option>            </form:select>            <input type="hidden" id="horaInicioSelected" />        </div>    </div></div>然后在我的 javascript 文件中我有以下内容：$(function() {    $.ajax({        url: rutaBase + '/huecos.json',        success: { function(huecos) {            console.log('Huecos' + huecos);            var enabledDates = [];            for (var key in huecos) {                  if (huecos.hasOwnProperty(key)) {                    enabledDates.push(key);                  }                }此 Ajax 调用得到类似 {2019-09-12=[12:00 - 13:00, 14:30 - 15:00], 2019-09-13=[10:00 - 11:00]} 的结果。但这不起作用，我得到一个带有日期和时间的日期时间选择器，但在控制台上什么也没有......如果我取出ajax调用并只输入enabledDates：[“2019-09-12”，“2019-09” -13"] 它有效，但如果我尝试从 ajax 调用中获取它们，则无效。我对 ajax/jquery/javascript 非常无用，所以我确信我做错了什么......

Answer 1

所以我猜想，我有各种语法错误：

$(function() {

    $.ajax({

        url : rutaBase + '/huecos.json',

        success : function(huecos) {

            var enabledDates = [];

            for ( var key in huecos) {

                if (huecos.hasOwnProperty(key)) {

                    enabledDates.push(key);

                }

            }

            $('#fechaCita').datetimepicker({

                format : 'DD/MM/YYYY', // Solo se mostrará la fecha

                enabledDates : enabledDates,

                icons : {

                    date : "fa fa-calendar",

                    up : "fa fa-caret-up",

                    down : "fa fa-caret-down",

                    previous : "fa fa-caret-left",

                    next : "fa fa-caret-right",

                    today : "fa fa-today",

                    clear : "fa fa-clear",

                    close : "fa fa-close"

                }

            });

            $("#fechaCita").on(

                    "change.datetimepicker",

                    function(e) {

                        $('#selectHoraCita').empty();

                        $('#selectHoraCita').append($("<option></option>").attr("value","").text("--"));

                        var horas = [];

                        var fecha = moment(e.date).format('YYYY-MM-DD');

                        horas.push(huecos[fecha]);

                        horas

                                .forEach(function(listItem) {

                                    listItem.forEach(function(opcion) {

                                        $('#selectHoraCita').append(

                                                $("<option></option>").attr(

                                                "value", opcion).text(

                                                opcion));

                                    });

                                });

                    });

        },

        error : function() {

            console.log('Error');

        }

    });

});