Дополнительные параметры полного календаря не добавлены

Я пытаюсь настроить параметры, которые отправляются с событиями и ресурсами в библиотеке fullCalendar.

Я использую полную версию календаря 3.

Я могу получить эти пользовательские параметры из формы и назначить их для запроса событий.

Но проблема заключается в том, что с ресурсами я использую один и тот же код для обоих, но запрошенный URL-адрес для разрывов ресурсов, а также потерял начальные и конечные коляски по умолчанию.

Код, который я пробовал:

resources: {
  // Resource route to load Instructors.
  url: resourcesCallback,
  method: 'GET',
  data: function() {
    var fields = jQuery('.calendar_filter_form').serializeArray();
    var datas = {};
    jQuery.each(fields, function(index, val) {
       /* iterate through array or object */
       datas[val.name] = val.value;
    });
    return datas;
  },
  failure: function() {
    alert('There was an error while fetching instructors!');
  },
}, 

и часть события:

events: {
  // Resource route to load Instractors.
  url: eventsCallback,
  method: 'GET',
  data: function() {
    var fields = jQuery('.calendar_filter_form').serializeArray();
    var data = {};
    jQuery.each(fields, function(index, val) {
       /* iterate through array or object */
       data[val.name] = val.value;
    });
    return data;
  },
  failure: function() {
    alert('there was an error while fetching events!');
  },
}

Сгенерированный URL-адрес, который я получаю, таков:

Для мероприятий:

URL запроса: DOMAIN/load?instractor=&lessonType=&date=&start=2019-07-22T00%3A00%3A00&end=2019-07-23T00%3A00%3A00&_=156377682

Для ресурсов:

URL запроса: DOMAIN/resources?_=1563776826863

Мне нужно сгенерировать второй URL-адрес, как и первый, поскольку вы видите, что код такой же, но результат другой, что не так?

Полный код, если нужно:

  $('#calendar').fullCalendar({
    defaultView: 'agendaDay',
    // Active the ajax reload the resources(instructors).
    refetchResourcesOnNavigate: true, 
    // To make the time slot divided in 15mis.
    slotDuration: "00:15:00",
    displayEventTime : false,
    // This define each time slot can get how many part
    // of the rows, for example if we set it to "00:01:00"
    // then it will divide each row by 15 mins but just show
    // the one between one like: 00:15:00 , 00:45:00 , 01:15:00.
    slotLabelInterval: "00:01:00",
    slotLabelFormat: ['H:mm'],
    groupByResource: true,
    // To trun of the all day row at the top of calendar.
    allDaySlot: false,
    groupByDateAndResource: true,
    // Settings for manage the calendar header options.
    header: {
      left: 'prev, today, next',
      center: 'title',
      right: null,
    },
    eventRender: function (event, $element) {
      // Render the Main content of the events with more details
      // and with html tags to be more user friendly.
      $element.find('.fc-title').html('<p style="text-align:center">'
        + event.lessonType + ' ~ ' + event.student
        + '<br>' + event.description
        + '<br>' + event.lessonAvailable + '~' + event.nextEvent + '</p>'
      );
    },
    // Define the Calendar column name.
    // This part should be dynamic and will 
    // define by instructor names.
    resources: {
      // Resource route to load Instructors.
      url: resourcesCallback,
      method: 'GET',
      data: function() {
        var fields = jQuery('.calendar_filter_form').serializeArray();
        var data = {};
        jQuery.each(fields, function(index, val) {
           /* iterate through array or object */
           data[val.name] = val.value;
        });
        return data;
      },
      failure: function() {
        alert('There was an error while fetching instructors!');
      },
    },
    // The main part of getting data and manipulate them
    // to show those in proper format in the calendar.
    // To match with resources here the resourceId should match
    // with the ids that provided in the resources.
    // Also to get proper location according to time slot
    // it need the correct start and end params that should
    // be in correct date format like: 2019-07-18T19:30:00.
    events: {
      // Resource route to load instructors.
      url: eventsCallback,
      method: 'GET',
      data: function() {
        var fields = jQuery('.calendar_filter_form').serializeArray();
        var datas = {};
        jQuery.each(fields, function(index, val) {
           /* iterate through array or object */
           datas[val.name] = val.value;
        });
        return datas;
      },
      failure: function() {
        alert('there was an error while fetching events!');
      },
    }
  });

person Nasser Ali Karimi    schedule 22.07.2019    source источник
comment
Мне удалось воспроизвести это: codepen.io/ADyson82/pen/rXOjZB?editors=1010< /а> . Кажется, что функция, определенная для data в объекте ресурса, никогда не выполняется, но ее определение приводит к удалению дополнительных параметров начала/конца из запроса. Я предполагаю, что это ошибка. Вы можете сообщить об этом, хотя, поскольку fullCalendar теперь перешел на версию 4, я не знаю, исправит ли кто-нибудь это в v3, но вы можете попробовать. Я не участвую в проекте, поэтому не знаю, работают ли они вообще над v3 или нет. Лучше всего спросить.   -  person ADyson    schedule 22.07.2019
comment
А пока, конечно, очевидным обходным решением является использование resources-as-function. вместо шаблона, вы можете создать запрос AJAX именно так, как вам нужно.   -  person ADyson    schedule 22.07.2019


Ответы (1)


В то же время, конечно, очевидным обходным путем является использование вместо этого шаблона ресурсов как функции, тогда вы можете создать запрос AJAX именно так, как вам нужно.

Спасибо, @ADyson.

resources: function(callback){  
  jQuery('input[name="start"]').val(jQuery('#calendar').fullCalendar('getView').start.format());
  jQuery('input[name="end"]').val(jQuery('#calendar').fullCalendar('getView').end.format());
  jQuery.ajax({
    url: resourcesCallback,
    type: 'GET',
    dataType: "json",
    data: jQuery('.calendar_filter_form').serialize(),
    error: function() {
      // alert('Oops! Try again.');
    },
    success: function(response){
      callback(response);
    }
  });
},
person Nasser Ali Karimi    schedule 25.07.2019