如果我想在日历上创建活动,事件会自动向前移动我不知道为什么并且它会在原始时间增加30分钟,例如,如果我点击 13:00 < / strong>我进入consloe
13:30 ,我不知道为什么。
我还创建了一个<input>
字段来设置开始时间,以便我可以看到我选择了哪个日期时间,并且我再次得到了30分钟的日期时间!
这是我的代码:
$(document).ready(function() {
var initialLocaleCode = 'ru';
var d = new Date();
$('#calendar').fullCalendar({
header: {
left: 'next today',
center: 'title',
right: 'month,agendaWeek,agendaDay,listMonth'
},
timezone: 'local',
defaultView: 'agendaWeek',
height: 650,
locale: initialLocaleCode,
navLinks: true,
selectable: true,
selectHelper: true,
editable: false,
resizable: true,
eventResize: true,
minTime: "06:00:00",
maxTime: "22:00:00",
eventLimit: 6,
unselectAuto: false,
selectConstraint: 'businessHours',
businessHours:
[
{% for work in current_user.work_hours %}
{
dow: [{{work.day_number}}],
start: '{{work.work_start.strftime("%H:%M")}}',
end: '{{work.work_end.strftime("%H:%M")}}',
},
{% endfor %}
],
select: function(mydate, start, end, event, jsEvent, allDay, view, element) {
var DaysOK = [1,2,3,4,5,6,7];
var mydateObj = new Date(mydate);
var chosenDay = mydateObj.getUTCDay();
var modal = $('#modal_calendar');
var title = $("select#serviceTitleCalendar option").filter(":selected").val();
if (title) {
$(modal).attr('style', 'display: block; top: 53px; left: 404px;');
$('body').append('<div id="mwb" onclick="MWHide()"></div>');
$("select#serviceTitleCalendar option").filter(function() {
return $(this).val() == $("#serviceSet").val();
}).attr('selected', true);
$('#book-calendar').val(moment(start).format('YYYY-MM-DD HH:mm'));
$("select#serviceTitleCalendar").off("change");
$('#send-appo').off("click");
$("select#serviceTitleCalendar").on("change", function() {
var nameService = $(this).val();
var csrf_token = "{{ csrf_token() }}";
$('.loading').html('<div class="spinner"> <img id="ld_spinner" src="/static/img/icon/circle-slack.gif" alt="spinner"/></div>');
if ($(this).val() == 'Выберите услугу') {
$('#dynamic-period').text('минутами');
$('.loading').html('<div class="spinner" style="display: none;"></div>');
return false;
} else {
setTimeout(function(){
$.ajax({
type: 'post',
cache: false,
url: '{{url_for("panel_abonent.get_service_period")}}',
data: {
service_period: nameService
},
beforeSend: function(xhr, settings) {
if (!/^(GET|HEAD|OPTIONS|TRACE)$/i.test(settings.type) && !this.crossDomain) {
xhr.setRequestHeader("X-CSRFToken", csrf_token);
}
},
complete: function(){
$('.loading').html('<div class="spinner" style="display: none;"></div>');
},
success: function(data){
if (data.time_period){
$('input[name="period"]').val(data.time_period);
$('#dynamic-period').text(data.time_period.split(':')[1]+' минут');
} else {
return false;
}
}
})
}, 2000);
}
});
}
});
});
答案 0 :(得分:1)
您对select
回调的定义不正确。
你给了:
select: function(mydate, start, end, event, jsEvent, allDay, view, element) {
但是fullCalendar文档(https://fullcalendar.io/docs/selection/select_callback/)显示了fullCalendar在运行它时将为该函数提供的参数。它显示以下内容:
function( start, end, jsEvent, view, [ resource ] )
(根据您是否拥有Scheduler插件,资源是可选的。)
正如您所看到的,文档中有一个示例,其中列表中的第一个参数被称为&#34; start&#34; ,第二个是&#34;结束&#34;。当然,您可以将它们称为您喜欢的,但它旨在表明这些参数包含的内容。
但是,在您的代码中,您已经调用了第一个参数&#34; myDate&#34;,并调用了第二个参数&#34; start&#34;。这并不意味着实际的第二个参数是开始。它只是您决定使用的名称。
此外,您已经定义了太多参数,超过了fullCalendar将为其发送的值。将参数映射到fullCalendar提供给它的值将为您提供:
所以当你写
$('#book-calendar').val(moment(start).format('YYYY-MM-DD HH:mm'));
你调用的变量&#34;开始&#34;实际上包含结束时间。广告位的默认持续时间为30分钟,这就是为什么该值在您点击时间后30分钟的原因。
您需要定义&#34;选择&#34;回调匹配文档,否则它没有意义。
澄清这个概念:当您定义这样的回调时,您将为fullCalendar提供一个稍后运行的函数。您可以指定您喜欢的任何参数 names ,但您不能只添加额外的参数 - fullCalendar如何知道您的意图,或者为它提供什么值?在fullCalendar代码中,已经有固定代码调用你给它的函数,并将它发送给它决定的参数。当程序员编写代码时,决定了这些参数的数量以及它们包含的信息类型。仅在运行时决定参数的值,而不是数量或类型。你无法控制任何一个。