-
fullcalendar 重新获取数据的问题10
我使用了fullcalendar这个插件,其中的事件是我后台获取到的json 串,当第一次显示的时候没有问题,可是当我点击下一月或者上一月的时候重新调用函数在获取数据的时候,这个数据可以取到也没有问题,只是显示出来的日历里面没有事件,请问是什么原因,必要的话我贴上代码,
2013年9月10日 11:03
2个答案 按时间排序 按投票排序
-
//初始化日程表 events:function(start, end, callback){ var a = new Date(); var fstart = $.fullCalendar.formatDate(start, "yyyy-MM-dd HH:mm"); var fend = $.fullCalendar.formatDate(end, "yyyy-MM-dd HH:mm"); $.ajax({ url: "<%=path%>/calendar.do?method=initial&t="+a.getTime(), dataType: 'xml', data:{"s":fstart,"e":fend}, success: function(doc) { var events = []; $(doc).find('event').each(function(){ //个人非全天事项 var color="blue"; //个人全天事项 if(Boolean(parseInt($(this).attr('allDay'))))color="red"; //分享非全天事项 if(Boolean(parseInt($(this).attr('isShare'))))color="green"; //分享全天事项 if(Boolean(parseInt($(this).attr('isShare')))&&Boolean(parseInt($(this).attr('allDay'))))color="#b7704f"; events.push({ id: $(this).attr('id'), title: $(this).attr('title'), start: $(this).attr('start'), end: $(this).attr('end'), color: color, shareName: $(this).attr('shareName'), shareId: $(this).attr('shareId'), isShare: $(this).attr('isShare'), allDay: Boolean(parseInt($(this).attr('allDay'))) }); }); callback(events); } }); },
$.ajax({ url:"<%=path%>/calendar.do?method=drag", type:"POST", contentType:"application/x-www-form-urlencoded;charset=GBK", data:{"id":event.id,"startTime":fstart,"endTime":fend,"allDay":allDay}, dataType:"xml", success:function(data){ var resultCode; $(data).find("result").each(function(i){ resultCode=$(this).children("resultCode").text(); }); if(resultCode!=0){ event.id=event.id; event.title=event.title; event.start=fstart; event.end=fend; event.addDay=allDay; event.color=color; $('#calendar').fullCalendar('updateEvent', event); } } });
2013年9月11日 10:30
-
不知道你有没有在初始化的时候就给fullcalen对象添加了你所要的事件?比如:evenetClick或者dayClick。必要的时候你还是看下Fullcalender的文档。
2013年9月10日 12:56
相关推荐
FullCalendar通过Ajax请求获取和更新事件数据。这里的`event.php`、`do.php`和`json.php`可能分别用于不同的数据操作: 1. `event.php`:通常用于提供初始的事件数据,通过查询数据库生成JSON格式的事件列表,返回...
此外,FullCalendar还支持JSON格式的数据源,使得从服务器获取或更新事件变得简单。 **JSON**:JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。在本...
5. **数据源集成**:FullCalendar可以与各种数据源集成,如Google Calendar、JSON、数据库等,方便数据的获取和更新。 6. **互动性**:用户可以通过拖放操作调整事件的时间和日期,增强了交互体验。 针对“农历...
例如,从服务器获取数据并动态加载到全历中。 8. **样式自定义**: 为了使FullCalendar符合你的网站设计,可以使用CSS来调整其样式。通过选择器修改类名,可以改变背景色、字体、边框等样式。 9. **兼容性和优化*...
例如,当用户添加、修改或删除事件时,这些操作会通过Ajax发送到服务器,然后服务器返回更新后的事件列表,FullCalendar再根据新的数据重新渲染日历。这样,用户可以在不刷新页面的情况下,看到实时的日程变化。 ...
FullCalendar支持多种方式提供事件数据,如JSON格式的服务器数据、静态JSON文件,甚至可以是JavaScript数组。在中国节日和节气的场景下,这些事件数据可能已经内置了中国的节日信息,开发者无需额外处理。 5. **...
为了使项目更具交互性,你可能需要从服务器获取实时的事件数据。这可以通过在`fetchEvents`方法中调用API来实现,或者使用WebSocket保持长连接更新日程。 在`fullcalendar-demo`这个项目中,你可以找到完整的代码...
events: '/your-server-script', // 从服务器获取事件数据 eventDrop: function(info) { // 事件移动后的回调 sendToServerForUpdate(info.event.id, info.oldStart, info.newStart); }, eventResize: function...
例如,可以通过AJAX请求获取服务器上的事件数据,或者将用户编辑的事件提交到服务器进行保存。这需要理解其提供的事件监听器和方法,如`eventClick`、`eventDrop`等。 在给定的压缩包`fullcalendar-1.4.8`中,包含...
- `refetchEvents()`:重新获取并渲染所有事件。 - `rerenderEvents()`:重新渲染当前所有事件。 - `select(startDate, endDate)`:监听并处理用户的选区操作。 在实际应用中,你可能还需要自定义事件的点击、拖拽...
你可以从服务器获取JSON数据,或者直接在JavaScript中定义事件数组。每个事件通常包含开始时间、结束时间、标题和描述等属性。 - **事件处理**: FullCalendar提供了丰富的事件接口,如`eventRender`允许你在事件...
这些资源可以从FullCalendar的官方网站下载或通过CDN链接获取。接着,我们需要配置初始化选项,定义日历的显示样式、时间格式以及事件来源等参数。例如: ```html <link rel="stylesheet" href="path/to/...
- **数据源**: 事件数据可以从JSON、数据库或其他API获取。FullCalendar支持动态加载和更新事件,使得日历保持实时性。 - **视图切换**: FullCalendar支持日、周、月等多种视图,并允许自定义视图,满足不同场景的...
1. **获取农历数据**:首先,需要一个可靠的农历转换库,如ChineseLunar,它可以将公历日期转换为对应的农历日期。 2. **整合到FullCalendar**:在FullCalendar的事件加载函数中,使用这个转换库将所有事件的日期从...
可以创建一个方法获取数据(例如通过API请求),然后使用`events`选项将数据传入Fullcalendar。例如: ```javascript data() { return { calendarOptions: { events: this.getEvents } } }, methods: { ...
全历(FullCalendar)是一款非常流行的...在获取到事件数据后,可以通过调用FullCalendar的API方法来创建和更新日历。此外,根据具体需求,还可以进行样式调整和功能扩展,以打造符合自身应用特色的日历组件。
1. **事件源**:在FullCalendar的初始化配置中,`events`属性可以是一个URL,FullCalendar会自动向这个URL发送请求,获取JSON格式的事件数据。 2. **数据格式**:返回的JSON数据应遵循FullCalendar的事件数据结构,...
4. **API调用**:`fullcalendar` 提供了丰富的API,如 `refetchEvents` 用于重新加载事件数据,`gotoDate` 用于跳转到特定日期等。 **四、示例和进阶用法** 在 `说明.txt` 文件中,通常会包含更多关于如何配置和...
通过API获取谷歌日历的数据,并将其加载到全历中,同时也可以将全历的事件保存到谷歌日历,实现双向同步。 6. **自定义视图**:全历允许开发者创建自定义视图,比如工作日视图、周工作小时视图等。这需要利用`...
别忘了为控制器创建相应的路由,这样 FullCalendar 就能正确地获取事件数据: ```php Route::get('/fullcalendar', [EventsController::class, 'index']); ``` 在前端,你需要引入 FullCalendar 的 CSS 和 ...