用流星全日历添加事件

Question

so I was able to create a fullcalendar in my application, but now I cant make the events show... this is my code 所以我能够在我的应用程序中创建一个全日历，但是现在我无法显示事件了……这是我的代码

main.js main.js

import { Template } from 'meteor/templating';
import { Notes } from '../lib/collections.js';



import './main.html';

Template.body.helpers({
 /*
  notes:[
    {text: 'My note 1'},
    {text: 'My note 2'},
    {text: 'My note 3'}
  ]
  */

  notes(){
    return Notes.find({});
  }
});


Template.add.events({
  'submit .add-form': function(){
    event.preventDefault();

    //get input value
    const target = event.target;
    const text = target.text.value;

    //insert note into collection
    Notes.insert({
      text,
      createdAt: new Date()
    });

    //clear the form
    target.text.value = '';

    //close the modal
    $('#modal1').modal('close');

    return false;
  }
});

Template.note.events({
 'click .delete-note': function(){
   Notes.remove(this._id);
   return false;
 }
});

Template.note.helpers({
  data:function(){
    return moment(this.date).format("dddd, h:mm");
  }
});


Template.example.helpers({
  options: function() {
      return {
          defaultView: 'agendaDay',
      };
  },
  events: function(){
    return{
      title  : 'event2',
      start  : '2018-28-01',
      allDay : false
    }
  }
});

main.html main.html

<head>
  <title>note manager</title>
   <!-- Compiled and minified CSS -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
   <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
   <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
</head>

<body>

<nav class="red">
  <div class="container">
    <div class="nav-wrapper">
      <a href="#" class="brand-logo">Danillo</a>
      <ul id="nav-mobile" class="right hide-on-med-and-down">
        <li class="nav-item">
            <a class="waves-effect waves-light btn modal-trigger" href="#modal1"> ADD Modal</a>
        </li>
      </ul>
    </div>
  </div>
</nav>
  <div class="container">
      <h1>Nomes</h1>
      <ul class="collection">
      {{#each notes}}
      {{> note}}
      {{/each}}
    </ul>
  </div>
  <div class="container" id="container2">
    {{> example}}
  </div>


  {{>add}}




  <script>
      $(document).ready(function(){
          // the "href" attribute of the modal trigger must specify the modal ID that wants to be triggered
          $('.modal').modal();
        });
        </script>

</body>

<template name="note">
  <li class="collection-item">
    {{text}} - {{data}}
    <a href="#" class="delete-note secondary-content"><i class="material-icons">close</i></a>
  </li>
</template>

<template name="add">
    <div id="modal1" class="modal">
        <div class="modal-content">
         <h3>Add Nome</h3>
         <form class="add-form">
           <input type="text" name="text" placeholder="Add Nome...">
         </form>
        </div>
      </div>

</template>

<template name="example">
  {{>fullcalendar options}}
</template>

I have found some tutorials, even here, but they dont work, my goal is to pass the information from the form in my modal to the events of the fullcalendar. 我已经找到了一些教程，即使在这里也没有用，但我的目标是将信息从模态表单中的信息传递给全日历事件。 Thanks for your help guys. 感谢您的帮助。

Answer 1

Inside 内

Template.TemplateName.rendered = function()

function you have to define all the things likes.eg-: eventRender,dayClick,eventAfterRender,viewRender,eventClick etc 函数，您必须定义所有喜欢的东西，例如：eventRender，dayClick，eventAfterRender，viewRender，eventClick等

sample code that I used inside Template.TemplateName.rendered = function() 我在Template.TemplateName.rendered = function（）中使用的示例代码

$('#calendar').fullCalendar({
        //height: "auto",
        minTime: OpenTime,
        maxTime: closeTime,
        slotDuration: '00:15:00',
        timezone: "Asia/Colombo",
        allDaySlot:false,
        dayOfMonthFormat: 'ddd - DD MMM',

        defaultView: 'multiColAgendaDay',
        views: {
            multiColAgendaDay: {
                // disabledColumns: [1],
                type: 'multiColAgenda',
                duration: { days: 1 },
                numColumns: 7,
                columnHeaders: stylistDetails,
                /* disabledColumns: [1] */
            }
        },
        scrollTime: '09:00:00',
        allDaySlot: false,
   /* header: {
   left: 'multiColAgendaDay',
   center: 'title',
   right: 'today prev,next'
   }, */

   header:false, 
   dayOfMonthFormat: 'ddd - DD MMM',

   events( start, end, timezone, callback ) {
    let filterBranchId = Session.get("filterBranchId");

    let data = AppointmentsServices.find({branchId:filterBranchId,stylistDisabled: {$ne: true}}).fetch().map( ( event ) => {

  return event;
});

用流星全日历添加事件

问题描述

1 个解决方案

解决方案1
0 2018-01-30 10:42:02

用流星全日历添加事件

问题描述

1 个解决方案

解决方案1 0 2018-01-30 10:42:02

解决方案1
0 2018-01-30 10:42:02