语义UI日历模式不会弹出

时间:2019-03-09 16:05:00

标签: javascript bootstrap-modal semantic-ui

我已经实现了语义UI来使用日历,该日历基本上非常好并且运行完美。唯一的问题是日历是模态的,当它触发时,模态如下所示: https://i.stack.imgur.com/WfB7K.png

我希望日历已经弹出,而不必单击“今天”按钮以显示日历。

我已经读过,它与观察值有一定关系,但是我不知道如何更改它以及将代码片段放置在哪里。(https://github.com/mdehoog/Semantic-UI-Calendar/issues/40

这是我的JS函数:

function devicesForCalendar(type) {

$('#openCalView').click(function () {
    var valueArray = [];

    $('.check:checked').each(function () {
        valueArray.push($(this).val());
    });
    if (valueArray.length == 0) {
        alert("No devices selected!");
        $('#calendarInsert').fullCalendar('destroy');
    }
    else {
        $.ajax({
            url: "db-functions.php",
            method: "POST",
            data: { data: valueArray, change: 'chosenCalendar', type: type },
            success: function (data) {

                var events = JSON.parse(data);

                $('#calendarInsert').fullCalendar('destroy');
                $('#calendarInsert').fullCalendar({
                    header: {
                        left: 'prev,next today',
                        center: 'title',
                        right: 'month,basicWeek,basicDay'
                    },
                    defaultDate: new Date(),
                    navLinks: true, // can click day/week names to navigate views
                    editable: true,
                    eventLimit: true, // allow "more" link when too many events
                    events: events
                });
            }
        });
    }
});

}

1 个答案:

答案 0 :(得分:0)

如果您要问如何使日历超出模态范围,则必须发布HTML代码,以便我们知道日历设计的全部工作方式。要解决不必单击Today按钮来显示日历的问题,问题就在于您分配了defaultDate变量。您将其设置为等于Date对象,但最终结果变为类似“ Sat Mar 09 2019 12:08:39 GMT-0500(东部标准时间)”的格式。它必须采用“ yyyy-mm-dd”标准ISO格式。为此,您只需输入今天的日期,或执行以下操作:

var d = new Date();
var e = d.getMonth();
if (e < 10) {
   var e2 = ("0" + e).slice(-2);
}
var f = d.getDate();
if (f < 10) {
   var f2 = ("0" + f).slice(-2);
}
var g = d.getFullYear() + "-" + e2 + "-" + f2;
// Later in the code
defaultDate: g,

请注意,我使用slice()方法将前导零放在单个数字上,因为Date.getMonth()Date.getDate()返回的数字是2和7。