选择后通过ajax发送fullcalendar开始和结束日期

时间:2014-10-06 13:39:53

标签: ajax fullcalendar

我需要通过ajax将开始和结束日期发送到服务器以将它们保存到数据库中。我试图在ajax调用取消选择方法后不进行ajax调用。我不确定问题是什么。请帮忙。

$('#calendar').fullCalendar({
header: {
    left: 'prev,next today',
    center: 'title',
    right: ''
},
defaultDate: '<?php echo date("Y-m-d") ?>',
defaultView: 'agendaWeek',
selectable: true,
selectHelper: true,
select: function(start, end) {
    //var title = prompt('Event Title:');
    var title = $("#gym_mbr_name").val();
    var eventData;
    if (title) {
        eventData = { title: title, start: start, end: end };
        var calendar_datetime = $('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true                   
    }

    $('#calendar').fullCalendar('unselect');

    $.ajax({                                                                                            
        url: '<?php echo BASE_URL; ?>ajax/add_membership_schedule.php',
        type: 'POST',
        data: { start: start, end: end }, 
        beforeSend: function(){ },
        complete: function(){ }
    }).done(function(resp){
        alert(resp);
    });

},
editable: true,
eventLimit: true, // allow "more" link when too many events
events: []

});

当我尝试提醒resp时,它没有给出任何输出,实际上ajax调用不会自动激活。请帮忙。

2 个答案:

答案 0 :(得分:1)

这似乎对我有用。

请注意,start和end是FCMoments(从Moments派生的奇怪生物),你想在ajax调用中使用它们之前将它们转换为字符串或其他东西。

另外,尝试使用“成功”而不是“完成”。

请在此处查看示例:http://jsfiddle.net/3E8nk/507/

$("#calendar").fullCalendar({
    header: {
        left: "prev,next today",
        center: "title",
        right: "month,agendaWeek,agendaDay"
    },
    defaultDate: "2014-06-12",
    editable: true,
    selectable: true,
    selectHelper: true,
    select: function(a, b) {
        alert("selected from: " + a.format() + ", to: " + b.format());
        $("#calendar").fullCalendar("unselect");
        $.ajax({
            url: "http://www.google.com",
            type: "GET",
            data: {
                q: "test"
            },
            dataType: "html",
            success: function(a) {
                alert("Data: " + a);
            },
            error: function(a, b) {
                alert("Request: " + JSON.stringify(a));
            }
        });
    },
    unselect: function() {
        alert("unseleted");
    },
    events: [ {
        title: "All Day Event",
        start: "2014-06-01"
    }, {
        title: "Long Event",
        start: "2014-06-07",
        end: "2014-06-10"
    }, {
        id: 999,
        title: "Repeating Event",
        start: "2014-06-09T16:00:00"
    }, {
        id: 999,
        title: "Repeating Event",
        start: "2014-06-16T16:00:00"
    }, {
        title: "Meeting",
        start: "2014-06-12T10:30:00",
        end: "2014-06-12T12:30:00"
    }, {
        title: "Lunch",
        start: "2014-06-12T12:00:00"
    }, {
        title: "Birthday Party",
        start: "2014-06-13T07:00:00"
    }, {
        title: "Click for Google",
        url: "http://google.com/",
        start: "2014-06-28"
    } ]
});

如果看起来没有帮助,那么尝试发布php产生的内容。

答案 1 :(得分:0)

在最新版本的FullCalendar中,我们必须在yyyy-mm-dd或同样的格式上捕捉MOMENT DATE格式。所以,对我来说这个代码正在运行:

start = $.fullCalendar.moment(start).format("YYYY-MM-DD HH:mm:ss"); 
 end = $.fullCalendar.moment(end).format("YYYY-MM-DD HH:mm:ss");