0

我正在为一个项目使用全日历。我无法将新事件插入 mysql 数据库。

它可以使用 AJAX 完成，但我无法将变量从 JS 传递到 php 代码。

这是我的代码：

$(document).ready(function() {

        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();

        var calendar = $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            } ,
            defaultView: 'month',
            weekends: true,
            selectable: true,
            selectHelper: false,
            allDayText: 'ore di lavoro',
            editable: true,
            theme: true,



            select: function(start, end, allDay,jsEvent,view) {

             if (view.name === "month") {

                $('#calendar').fullCalendar('gotoDate', start);
                $('#calendar').fullCalendar('changeView', 'agendaDay');


            } else {

                var title = prompt('Riparazione racchetta da tennis:');
                if (title) {  
                    calendar.fullCalendar('renderEvent',
                        {
                            title: title,
                            start: start,
                            end: end,
                            allDay: allDay
                        },
                        true // make the event "stick"


                    );
                   $.ajax({

                      type: "POST",
                      url: "kot.php",
                      data: "title=" + title + "&start=" + start + "&end=" + end,

                   });
                $('#calendar').fullCalendar('refetchEvents');   
                }
                calendar.fullCalendar('unselect');
            }
            },

             eventSources: [

        // your event source
        {
            url: 'json-events.php',
            type: 'POST',

            error: function() {
                alert('there was an error while fetching events!');
            },
            //color: 'blue',   // a non-ajax option
            //textColor: 'black' // a non-ajax option
        },

        // any other sources...
      {
            url: 'kot.php',
            type: 'POST',
            data: {
                custom_param1: 'something',
                custom_param2: 'somethingelse',
                custom_param3: 'somethingelsee'

            },
            error: function() {
                alert('there was an error while fetching events!');
            },
            color: 'yellow',   // a non-ajax option
            textColor: 'black' // a non-ajax option
        }
    ]               
        });
    });
4

1 回答 1

0

在您的 fullCalendar 初始化中，作为组织问题，您可能需要考虑将函数调用放在初始化参数与内联 js 代码中。

像这样：

  function dayClickEvent(date, allday, jsEvent, view){
       //do something with date, allday, jsEvent, view 
  }
  function eventClickEvent(event, jsEvent, view){
       //do something with event, jsEvent, view
  }
  function eventAfterRenderEvent(event, element, view){
       //do something with event, element, view
  }
  function eventMouseoverEvent(event, jsEvent, view){
       //do something with event, element, view
  }
  function eventMouseoutEvent(event, jsEvent, view){
       //do something with event, element, view
  }
  function viewDisplayEvent(view){
       //do something with view
  }
  function loadingEvent(bool){
       //do something with bool
  }

然后当你初始化：

  $('#fullcalendar').fullCalendar({
    theme: true,
    header: {
        theme: true,
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    editable: true,
    eventSources: [
        {
            url: 'my/calender/data/url',
            cache: false,
            type: 'POST',

            data: {
                ourl: 'my/actionable/url',
                myProperty: $("#foo").data("val") || ''
            },

            error: function (prob) {
                //handle ajax error for event load
            }
        }
    ],
    dayClick: function (theDate, allDay, jsEvent, view) {
        dayClickEvent(theDate, allDay, jsEvent, view);
    },
    eventClick: function (event, jsEvent, view) {
        eventClickEvent(event, jsEvent, view);
    },
    eventAfterRender: function (event, element, view) {
        eventAfterRenderEvent(event, element, view);
    },
    eventMouseover: function (event, jsEvent, view) {
        eventMouseoverEvent(event, jsEvent, view);
    },
    eventMouseout: function (event, jsEvent, view) {
        eventMouseoutEvent(event, jsEvent, view);
    },
    viewDisplay: function (view) {
        viewDisplayEvent(view)
    },
    loading: function (bool) {
        loadingEvent(bool)
    }
});

至于您的 ajax 问题...在不知道您的端点（服务器/应用程序/页面）是如何配置的情况下，这是一个带有花里胡哨的示例 ajax 调用（您的 ajax 调用似乎缺少一些属性）：

 $.ajax({
    type: 'POST',
    url: "my/Url/Here",
    dataType: "json",
    data: JSON.stringify({myProperty:"myValue"}),
    cache: false,
    contentType: "application/json; charset=utf-8",
    traditional: true,
    success: function (returnObject) {
        ///do something with returnObject
    },
    error: function (exception) {
        ///exception.responseText will contain any pertinent errors returned from server.
    }
});

您可以在此处查看有关 jQuery $.ajax() 方法的更多信息。

我想说 - 检查您的端点（服务器/应用程序/页面）是如何配置的（例如 - 它希望从要处理的请求中接受/查找什么），并相应地参数化/调整您的 ajax 调用。

于 2012-11-29T15:29:20.550 回答