使用变量添加事件的FullCalendar

Question

我在使用事件string将事件添加到FullCalendar时遇到了麻烦。我不知道我做错了什么。

<script>
$(document).ready(function() {
    var value=<?php echo $_SESSION['calAvail']; ?>;
    console.log(value);
    var eventString = "[{";
    console.log(value.endDate[0].substring(11,16));
    for(var i = 0, max = value.endDate.length; i < max; i++) {
        if( i != value.endDate.length-1) {
            eventString += "title:" + """ + value.title[i] + "", ";
            eventString += "start:" + """ + value.startDate[i].substring(11,16) + "", ";
            eventString += "end: " + """ + value.endDate[i].substring(11,16) + "", ";
            eventString += "dow: [" + value.day[i] + "] },{ ";
        } else {
            eventString += "title: " + """ + value.title[i] + "", ";
            eventString += "start:" + """ + value.startDate[i].substring(11,16) + "", ";
            eventString += "end: " + """ + value.endDate[i].substring(11,16) + "", ";
            eventString += "dow: [" + value.day[i] + "] ";
        }
    }
    eventString += "}]"; 
    console.log(eventString);
    var eventShow = eventString;
    $('#calendar').fullCalendar({
        defaultDate: moment(),
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        defaultView: 'month',
        events: eventString
    })
});
</script>

<script type="text/javascript">
    function userInfoChange() {
        window.location = "http://localhost/TisTheSeason/profile_user_edit.php";
    }
</script>

因此，首先，我正在创建一个基于包含标题，start和end字段的JSON的字符串。我的计划是动态地删除JSON中的信息，然后格式化，以便遵循以下内容：

[{ "title": "", "start": "", "end": "" }]

我做到了，但我似乎无法将变量放在事件中：

Answer 1

在events属性中，FullCalendar希望得到

a）一个JavaScript变量 - 必须是包含一系列事件对象（文档）或

的数组

b）从其中可以下载JSON字符串的URL，然后将其自动解析到包含事件对象（文档）或

的JavaScript数组中

c）一个与b）进行相同过程的函数，但使用自定义数据源（文档）。

您的代码似乎正在尝试实现选项a），而不是从数据中创建JavaScript array ，而是创建一个包含 String 的变量（即。一些纯文本）。字符串恰好看起来像JSON，但仍然是 String 。这不是数组。FullCalendar并不期望这一点。这不是可用的数据结构。为了使用，首先必须将其解析并将其变成一个数组，然后再将其交给FullCalendar。

通常，如果您实现了选项c）（并且在选项B中），FullCalendar将代表您执行该部分，但对于选项A）。

现在...您正在使用JavaScript创建此变量，因此，简单地通过在代码中声明它直接创建所需的JavaScript数组就更有意义。使用JavaScript制作字符串，然后将其解析回JavaScript数组，这只是毫无意义的额外步骤。（此外，这样的手工构建JSON字符串非常容易受到意外语法错误的注入，因此在任何情况下都不应尝试。如果您实际需要创建JSON，则使用合适的代码库来执行此操作。）

$(document).ready(function() {
  var value= <?php echo $_SESSION['calAvail']; ?>;
  var eventList = []; //declare an array, not a string!
  for(var i = 0; i < value.endDate.length; i++) {
    var event = { 
      "title": value.title[i], 
      "start": value.startDate[i].substring(11,16),
      "end": value.endDate[i].substring(11,16),
      "dow": [ value.day[i] ]
    };
    eventList.push(event);
  }
  console.log(JSON.stringify(eventList));
  $('#calendar').fullCalendar({
    header: {
      left: 'prev,next today',
      center: 'title',
      right: 'month,agendaWeek,agendaDay'
    },
    defaultView: 'month',
    events: eventList
  });
});

因此，您在这里所做的所有本质上都将数据结构从一种格式转换为另一种格式。请注意，它的清洁度更高，更易于阅读（以及测试，维护和调试）。另外，在您的for循环中的if/else似乎在任何一种情况下都会产生相同的对象，因此尚不清楚其目的是什么。我在版本中删除了该测试。

defaultDate: moment()在您的FullCalendar声明中也是多余的-FullCalendar将默认情况下显示今天的日期（文档）。