如果事件在 MySQL DB 中设置为不显示，如何在 FullCalendar 上禁用模式？

Question

我目前正在尝试在我的全日历中插入一个函数，由于数据库中为事件设置了一个变量，所以我希望模态不显示。

我的目标如下：

活动被标记为未出现
事件显示在日历中
如果点击事件没有发生或者出现事件不可选择的错误信息
未标记为未出现的事件应正常打开模态

我的calendar.js:

var calendar = new FullCalendar.Calendar(calendarEl, {
    locale: 'de',
    defaultView: 'timeGridWeek',
    plugins: ['interaction', 'dayGrid', 'timeGrid', 'list'],
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'timeGridWeek,listMonth'
    },
    navLinks: false, // can click day/week names to navigate views
    businessHours: false, // display business hours
    editable: true,
    //uncomment to have a default date
    //defaultDate: currentTime,
    defaultDate: '2020-11-16',
    events: url+'api/load.php',
    eventClick: function(arg) {
        var id = arg.event.id;
        var eventOpen = arg.event.open;
        
        $('#editEventId').val(id);
        $('#editOpen').val(eventOpen);

        $.ajax({
          url:url+"api/getevent.php",
          type:"POST",
          dataType: 'json',
          data:{id:id},
          success: function(data) {
                $('#editEventTitle').val(data.title);
                $('#editStartDate').val(data.start);
                $('#editEndDate').val(data.end);
                $('#editColor').val(data.color);
                $('#editTextColor').val(data.textColor);
                $('#editOpen').val(data.open);
                $('#editeventmodal').modal();
            }
        });

        if (eventOpen == 'no') {
            $('#editeventmodal').modal('hide');
        }

        calendar.refetchEvents();
    }
});

我的得到event.php（open是带“no”或“yes”的未显示值）：

<?php
include("../config.php");
if (isset($_POST['id'])) {
  $row = $db->row("SELECT * FROM tbl_events where id=?", [$_POST['id']]);
  $data = [
    'id'        => $row->id,
    'title'     => $row->title,
    'start'     => date('d-m-Y H:i:s', strtotime($row->start_event)),
    'end'       => date('d-m-Y H:i:s', strtotime($row->end_event)),
    'color'     => $row->color,
    'textColor' => $row->text_color,
    'open'      => $row->open
  ];
  echo json_encode($data);
 }
 ?>

我的 index.php 表格的开头：

<div class="modal fade" id="editeventmodal" tabindex="-1" role="dialog">
<div class="modal-dialog">
    <div class="modal-content">

        <div class="modal-header">
            <h5 class="modal-title">Für Event eintragen</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="modal-body">

            <div class="container-fluid">

                <form id="editEvent" class="form-horizontal">
                <input type="hidden" id="editEventId" name="editEventId" value="">
                <input type="hidden" id="editOpen" name="editOpen" value="">

感谢您的帮助。

Answer 1

这位：

if (eventOpen == 'no') {
            $('#editeventmodal').modal('hide');
}

没有意义因为

a) 它依赖于 eventOpen，它试图在

的 fullCalendar 事件对象上使用一个值

将不存在，因为自定义属性是 stored in the extendedProps collection of the event 和
没有像您所说的那样使用数据库中的值。

也因为

b) 在进行检查之前它不是 waiting for the AJAX call to complete - 所以即使它依赖于数据库中正确的属性，该值还不存在，模态也不存在 -它会在模态显示之前尝试隐藏它！

另外，如果您不想显示模态框，那又有什么意义呢？显示然后立即再次隐藏只是浪费代码和时间。

这更合乎逻辑，看起来应该可行：

eventClick: function(arg) {
    var id = arg.event.id;

    $.ajax({
      url: url+"api/getevent.php",
      type: "POST",
      dataType: "json",
      data: { id: id },
      success: function(data) {
        //only populate and show the modal if the event was a "show"
        if (data.open == "yes")
        {
            $('#editEventId').val(id);
            $('#editOpen').val(data.open);
            $('#editEventTitle').val(data.title);
            $('#editStartDate').val(data.start);
            $('#editEndDate').val(data.end);
            $('#editColor').val(data.color);
            $('#editTextColor').val(data.textColor);
            $('#editOpen').val(data.open);
            $('#editeventmodal').modal();
        }
        else {
          alert("Event is a no-show");
        }
      }
    });
}

也不清楚为什么 calendar.refetchEvents() 在这种情况下会有所帮助，因为到运行时，您无法更改日历或数据库中的任何数据。所以我删除了它。

如果事件在 MySQL DB 中设置为不显示，如何在 FullCalendar 上禁用模式？

How to disable the modal on FullCalendar if a event is set to no-show in MySQL DB?

javascript

php

mysql

ajax

fullcalendar