ajax无法使用完整日历

时间:2014-11-08 18:39:34

标签: javascript jquery ajax fullcalendar

我已经为主题分配接口使用了full calendar外部拖动事件。使用ajax将主题详细信息更新到mysql数据库但是ajax无效。我没有在控制器中获取值。检查其他问题在这里,但没有找到解决方案。可以帮助吗?

<link href='assets/fullcalendar/fullcalendar.css' rel='stylesheet' />
<link href='assets/fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print' />
<script src='assets/fullcalendar/lib/moment.min.js'></script>
 <script src='assets/js/jquery.js'></script>
  <script src='assets/fullcalendar/lib/jquery-ui.custom.min.js'></script>
 <script src='assets/fullcalendar/fullcalendar.min.js'>  </script>
<script>
$(document).ready(function() {    
    /* initialize the external events
    -----------------------------------------------------------------*/

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

        // create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/)
        // it doesn't need to have a start or end
        var eventObject = {
            title: $.trim($(this).text()) // use the element's text as the event title
        };

        // store the Event Object in the DOM element so we can get to it later
        $(this).data('eventObject', eventObject);

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

    });

/* initialize the calendar
-----------------------------------------------------------------*/
  $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        editable: true,
        droppable: true,
        drop: function(date,event) {


          // retrieve the dropped element's stored Event Object
                var originalEventObject = $(this).data('eventObject');

        // we need to copy it, so that multiple events don't have a reference to the same object
                var copiedEventObject = $.extend({}, originalEventObject);

        // assign it the date that was reported
                copiedEventObject.start = date;

        // render the event on the calendar
        // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)

                $('#calendar').fullCalendar('renderEvent', copiedEventObject, true);

                // is the "remove after drop" checkbox checked?

                if ($('#drop-remove').is(':checked')) {
                    // if so, remove the element from the "Draggable Events" list
                    $(this).remove();
                }
             $.ajax({
               url: '/addSchedule',
               dataType: 'json',
               type: 'post',
               data: {event: event},                  
               success: function(response){
                  console.log('response');
               }
             });

      }     

    });


});
</script> 

1 个答案:

答案 0 :(得分:1)

我遇到了与@AVM相同的问题,使用了他正在使用的相同程序。

这是解决这个问题的方法:

        var event_title = event.title;
        var event_date = event._start.format();
        var event_backgroundColor = event.backgroundColor;
        var event_borderColor = event.borderColor;

        $.ajax({
            url: '../php/add_event.php',
            type: 'post',
            data: {
                title: event_title,
                date: event_date,
                backgroundColor: event_backgroundColor,
                borderColor: event_borderColor
            },
            success: function(response){
              alert(response);
            },
            error: function(){
                alert("error");
            }
        });

请注意:

 var event_date = event._start.format();

这解决了我的问题,我希望它会解决你的问题。

由于 垫