2017-04-17 306 views
1

我已经安装了Fullcalendar软件包(Symfony2),并且所添加的所有事件都正确显示。现在我在Fullcalendar.js中添加eventClick函数(它与open.window('page')一起用于测试)。现在,我想在alert()或其他内容中取得所有关于此事件的信息(ID,姓名等),而不是window.open()将数据库中的数据映射到JSON对象Fullcalendar

我该怎么做?

$(function() { 
/* initialize the calendar 
-----------------------------------------------------------------*/ 
//Date for the calendar events (dummy data) 
var date = new Date(); 
var d = date.getDate(), 
    m = date.getMonth(), 
    y = date.getFullYear(); 
$('#calendar-place').fullCalendar({ 
    monthNames: ["Janvier","Février","Mars","Avril","Mai","Juin","Julliet", "Aout", "Septembre", "Octobre", "Novembre", "Decembre" ], 
    monthNamesShort: ['Jan','Fev','Mar','Avr','Mai','Jun','Jul','Aou','Sep','Oct','Nov','Dec'], 
    dayNames: [ 'Diamnche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi'], 
    dayNamesShort: ['Diu','Dill','Dim','Dix','Dij','Div','Dis'], 

    header: { 
     left: 'prev,next today', 
     center: 'title', 
     right: 'month,agendaWeek,agendaDay' 
    }, 
    buttonText: { 
     today: 'today', 
     month: 'month', 
     week: 'week', 
     day: 'day' 
    }, 
    events: 
    { 
     url:Routing.generate('fullcalendar_loadevents', { month: moment().format('MM'), year: moment().format('YYYY') }), 
     color: '#45b2ea', 
     textColor:'white', 

     error: function() { 
      alert('Error receving events'); 
     } 
    }, 
    viewRender: function (view, element) { 
     var month = view.calendar.getDate().format('MM'); 
     var year = view.calendar.getDate().format('YYYY'); 
    }, 

    eventClick: function() { 

     window.open('login') 
    }, 





    eventDrop: function(event,delta,revertFunc) { 
     var newStartData = event.start.format('YYYY-MM-DD'); 
     var newEndData = (event.end == null) ? newStartData : event.end.format('YYYY-MM-DD'); 

     $.ajax({ 
      url: Routing.generate('fullcalendar_changedate'), 
      data: { id: event.id, newStartData: newStartData,newEndData:newEndData }, 
      type: 'POST', 
      dataType: 'json', 
      success: function(response){ 
       console.log('ok'); 
      }, 
      error: function(e){ 
       revertFunc(); 
       alert('Error processing your request: '+e.responseText); 
      } 
     }); 

    }, 
    eventResize: function(event, delta, revertFunc) { 

     var newData = event.end.format('YYYY-MM-DD'); 
     $.ajax({ 
      url: Routing.generate('fullcalendar_resizedate'), 
      data: { id: event.id, newDate: newData }, 
      type: 'POST', 
      dataType: 'json', 
      success: function(response){ 
       console.log('ok'); 
      }, 
      error: function(e){ 
       revertFunc(); 
       alert('Error processing your request: '+e.responseText); 
      } 
     }); 

    }, 
    editable: true 

}); 
}); 
+0

你能否添加任何细节,如遇到的错误问题? [如何问一个好问题?](http://stackoverflow.com/help/how-to-ask),[如何创建一个最小,完整和可验证的示例](http://stackoverflow.com/帮助/ mcve)向社区展示你所尝试过的东西。 – abielita

+0

简而言之,事件对象总是在eventCLick中是未定义的,它显示我在我的控制台未定义属性的标题为expl虽然事件和事件调整大小工作正常 –

回答

0

如果你在阅读https://fullcalendar.io/docs/mouse/eventClick/的eventClick文档它表明你可以继续回调,其中包括含有点击事件的详细信息的“事件”对象的参数。

所以,你可以做这样的事情:

eventClick: function(event, jsEvent, view) 
{ 
    alert(event.title); 
} 

您可以在这里找到事件对象的更多属性:https://fullcalendar.io/docs/event_data/Event_Object/如果你想使用有关该事件的其他信息。

+0

对象事件未定义总是在eventClick我跟随文档evenDrop和调整大小工作正确只是eventClick –

+0

您的代码当前不会在您的eventClick定义中声明事件对象。你必须写在那里,就像我在答案中所做的一样。一旦你这样做,没有理由不应该工作。下面是一个使用日历设置的工作示例:https://jsfiddle.net/yog1jc45/1/我已经用一些示例事件替换了ajax源代码,因为我无法从演示中调用您的ajax URL,但原则是相同。如果你点击一个事件,会弹出一个显示事件标题的弹出窗口,没有问题。 – ADyson

+0

我做了你现在已经做过的eventclick(event,jsEVent,view)和一个简单的alert events.title它告诉我一个alert(event.title)错误也许你说ajax dosen't work我可以'如果你有一个事件点击(并触发回调),那么你可以获得对象事件 –