在fullcalendar调度程序eventReceive上设置输入标题

In setting up the Scheduler premium component to test with the FullCalendar integration, I'm trying to simulate a conference room schedule using time durations from external events. The same concept as the normal drag n' drop external events demo on the fullcalendar site but with each event being a specific length of time. I have this working but I want to be able to set the title of the event in a text Input field before I drag then use that text as the Event Title once it's dragged onto the scheduler.

在设置调度程序高级组件以使用FullCalendar集成进行测试时,我正在尝试使用外部事件的持续时间来模拟会议室计划。与fullcalendar网站上的普通拖放外部事件演示相同的概念,但每个事件都是特定的时间长度。我有这个工作,但我希望能够在我拖动之前在文本输入字段中设置事件的标题,然后将该文本作为事件标题拖动到调度程序后使用。

<div id='external-events'>
<p>Type event name then drag the length</p>
<input type="text" class="form-control" placeholder="Event Title" value="test" id="event-title">
<div class='external-event navy-bg' data-duration="00:30">30 minutes</div>
<div class='external-event navy-bg' data-duration="01:00">1 hour</div>
<div class='external-event navy-bg' data-duration="02:00">2 hours</div>
<div class='external-event navy-bg' data-duration="03:00">3 hours</div>
<div class='external-event navy-bg' data-duration="04:00">4 hours</div>
<div class='external-event navy-bg' data-duration="days:1">All day</div>

    $('#external-events div.external-event').each(function() {

    var eventtitle = $('#event-title').val();
    // store data so the calendar knows to render an event upon drop
    $(this).data('event', {
        title: $.trim(eventtitle), // use the element's text as the event title
        stick: true // maintain when user navigates (see docs on the renderEvent method)
    });

    // make the event draggable using jQuery UI
    $(this).draggable({
        zIndex: 1111999,
        revert: true,      // will cause the event to go back to its
        revertDuration: 0  //  original position after the drag
    });

});

This is working great for getting the title from the input and the duration size working.

这非常适合从输入和持续时间大小中获取标题。

In the fullCalendar initialization I believe I need to use the eventReceive function to update that title with whatever is typed in because currently it uses the "test" only since that's what is defined above.

在fullCalendar初始化中,我相信我需要使用eventReceive函数来更新该标题,因为它目前仅使用“test”,因为它是上面定义的内容。

    eventReceive: function(event) {
        var eventtitle = $('#event-title').val();
        // some way of defining the title here???
    },

1 个解决方案

#1

Figured it out. Simply requires the 'updateEvent' method

弄清楚了。只需要'updateEvent'方法

        eventReceive: function(event) {
        event.title = $('#event-title').val();
        $('#calendar').fullCalendar('updateEvent', event);
    },