2

所以我在这里安静地进行混搭/收集...在我们的应用程序中,我们使用FullCalendar并在Bootstrap Modal中加载事件,然后如果用户愿意,他/她可以单击该字段,它会变成可在jEditable的帮助下进行编辑,以及我为Timepicker字段创建的新自定义“类型”。

下面的代码是为时间选择器可编辑字段创建新输入类型的内容

$.editable.addInputType('timepicker',
{
    element : function(settings, original)
        {
            var input = $('<input id="timeToEdit">');
            input.attr('autocomplete','off');
            var hidden = $('<input type="hidden" id="editedEventTime" />');
            $(this).append(hidden);
            $(this).append(input);
            return(hidden);
        },
    plugin : function(settings, original)
        {
            var form = this;
            settings.onblur = 'ignore';
            $(this).find('#timeToEdit').timepicker(
                {
                    alwaysSetTime: true,
                    timeOnly: true,
                    timeFormat: "h:mm TT",
                    altField: "#editedEventTime",
                    altFieldTimeOnly: true,
                    altTimeFormat: "HH:mm:00",
                    stepHour: 1,
                    stepMinute: 15,
                    onSelect: function(dateText) {},
                    onClose: function(dateText)
                        {
                            original.reset.apply(form, [settings, original]);
                        },
                });
        }
});

这是让我在点击可编辑字段时添加该时间选择器的代码:

$('.eventEditStartTime').editable('phpfiletotalktodb.php', {
    type : "timepicker",
    submit : "<span class='btn btn-mini btn-success'><i class='icon-ok'></i></span>",
    cancel    : "<span class='btn btn-mini btn-danger'><i class='icon-remove'></i></span>",
    tooltip     : "Edit start of the event",
    indicator : "Saving...",
    callback    : function(value, settings) {
    $('#fullCalendar').fullCalendar('refetchEvents');
            }
        });

我遇到的问题是,如果用户单击要编辑的字段,但没有选择任何内容,然后单击屏幕并且模式窗口消失,然后用户再次单击该事件进行编辑,它将不会t 使该字段再次可编辑。

我能想到的一个可能原因是,当用户单击事件时,它会显示出来,然后用户单击时间字段进行编辑,下拉菜单显示但该字段为空,即使该值处于“隐藏”状态字段,也许这就是导致它呈现不可编辑的原因,但我不知道如何绕过它。

提前感谢您的帮助并对此进行调查。

4

0 回答 0