首页 > 专利查询

FullCalendar(日程管理控件)

FullCalendar（⽇程管理控件）(以下是我学习FullCalendar控件时，⽹络上收集的⼀些资料)
第⼀部分（官⽅资料）
.fullCalendar官⽅⽹址:
.fullCalendar英⽂⽂档:
jquery.fullCalendar下载:
第⼆部分（官⽅⽂档的翻译）
第三部分（视频教程）
（⼀共两集）
第四部分（实战）
（⾃⼰做了⼀个⽇程管理）
主要的代码如下：
64.            firstDay: 1,
65.            buttonText: {
66.                today: '今天',
67.                month: '⽉',
68.                week: '周',
69.                day: '⽇',
70.                prev: '上⼀⽉',
71.                next: '下⼀⽉'
72.            },
73.            allDaySlot:false,
74.            selectable: true,
75.            selectHelper: true,
76.            aspectRatio:2.7,
77.            editable: false,
78.            allDayDefault:false,
79.            viewDisplay: function(view) {
80. var viewStart = $.fullCalendar.formatDate(view.start,"yyyy-MM-dd HH:mm:ss");
81. var viewEnd = $.fullCalendar.d,"yyyy-MM-dd HH:mm:ss");
82.            $("#calendar").fullCalendar('removeEvents');
83.            $.getJSON('localhost:8080/pnote/schedule/listevents.action',{start:viewStart,end:viewEnd},function(data) {
84. for(var i=0;i<data.length;i++) {
85. var obj = new Object();
86.                    obj.id = data[i].id;
87.                    obj.title = data[i].title;
88.                    obj.description = data[i].description;
89.                    lor = data[i].color;
90.                    indertime = $.fullCalendar.parseDate(data[i].remindertime);
91.                    ssagenotice = data[i].messagenotice;
92.                    obj.description = data[i].description;
93.                    obj.start = $.fullCalendar.parseDate(data[i].start);
94.                    d = $.fullCalendar.parseDate(data[i].end);
95.                    $("#calendar").fullCalendar('renderEvent',obj,true);
96.                }
97.              }); //把从后台取出的数据进⾏封装以后在页⾯上以fullCalendar的⽅式进⾏显⽰
98.            },
99.            eventMouseover: function(event, jsEvent, view){
100.                showDetail(event, jsEvent);
101.            },
102.            eventMouseout: function(event, jsEvent, view){
103.                $('#tip').remove();
104.            },
105. //⽇程点击：添加⽇程
106.            dayClick: function(date, allDay, jsEvent, view) {
107. var obj =new Object();
108.                  art.dialog.open('newschedule.html',{
109.                    title: '添加⽇程',
110.                    lock: true,
111.                    width:300,
112.                    height:400,
113.                    fixed: true, //固定定位
114. //background: '#600', // 背景⾊
115.                    opacity: 0.6,  // 透明度
116. // 在open()⽅法中，init会等待iframe加载完毕后执⾏
117.                    init: function () {
118. var iframe = tWindow;
119. //var top = p;// 引⽤顶层页⾯window对象
120. var start = ElementById('form-start');
121.                        start.value = $.fullCalendar.formatDate(date,"yyyy-MM-dd HH:mm:ss");
122.                      },
123.                      okVal:'提交⽇程',
124.                      ok: function () {
125. var iframe = tWindow;
126. if (!iframe.document.body) {
127.                            alert('iframe还没加载完毕呢');
128. return false;
129.                        };
130.
131. var start = ElementById('form-start').value;
132. var end = ElementById('form-end').value;
133. var remindertime = ElementById('form-remindertime').value;
134.                        obj.title = ElementById('form-title').value;
135.                        obj.description = ElementById('form-description').value;
136.                        obj.start = $.fullCalendar.parseDate(start);
137.                        d = $.fullCalendar.parseDate(end);
138.                        lor = ElementById('form-color').value;
日程管理免烧砖机模具139. if (obj.title== '') {
140.                            alert("标题不能为空");
141. return false;
142.                          }else if(start== '') {
143.                            alert("开始⽇期不能为空");
144. return false;
145.                          }else if(end == '') {
146.                            alert("结束⽇期不能为空");
147. return false;
148.                          }else if(ElementById('form-messagenotice').checked) {
148.                          }else if(ElementById('form-messagenotice').checked) {
149. if(remindertime == '') {
150.                                    alert("短信提醒时间不能为空");
151. return false;
152.                                }
153.                                ssagenotice = 1;
154.                                indertime = $.fullCalendar.parseDate(remindertime);
155.                            }else {
地脚锚栓
156.                                ssagenotice = 0;
157.                                indertime = null;
158.                            }
159.
160.                          $.post("localhost:8080/pnote/schedule/addevents",{//把刚输⼊的⽇程计划信息传到后台，保存到数据库
161.                            title: obj.title,
162.                            start:start,
163.                            end:end,
164.                            description:obj.description,
165.                            remindertime:remindertime,
166.                            lor,
167.                            ssagenotice
168.                            },
169. function (data, textStatus){
170.                                obj.id = data[0].id;
171.                            }, "json"
172.                          );
173.                          $('#calendar').fullCalendar('renderEvent', obj);  //核⼼的更新代码
174.                          $('#calendar').fullCalendar('unselect');
175.                          ice({
176.                                title: '笔记之家',
177.                                width: 150,// 必须指定⼀个像素宽度值或者百分⽐，否则浏览器窗⼝改变可能导致artDialog收缩
178.                                content: '⽇程已添加⾄后台！',
179.                                icon: 'face-smile',
多功能按摩垫180.                                time: 3
181.                            });
182. return true;
183.                        },
184.                        cancel: true
185.                    });
186.            },
187.            eventClick:function(calEvent, jsEvent, view){
188.                art.dialog.open('newschedule.html', {
189.                    title: '更新⽇程',
190.                    lock: true,
191.                    width:300,
192.                    height:400,
193. //background: '#600', // 背景⾊
194.                    opacity: 0.6,  // 透明度
195. // 在open()⽅法中，init会等待iframe加载完毕后执⾏
196.                    init: function () {
197. var iframe = tWindow;
198. //var top = p;// 引⽤顶层页⾯window对象
199.                        ElementById('form-start').value = $.fullCalendar.formatDate(calEvent.start,"yyyy-MM-dd HH:mm:ss");
200.                        ElementById('form-end').value = $.fullCalendar.d,"yyyy-MM-dd HH:mm:ss");  201.                        ElementById('form-description').value = calEvent.description;
202.                        ElementById('form-title').value = calEvent.title;
203. ssagenotice == 1) {
204.                            ElementById('form-messagenotice').checked = true;
205.                            ElementById('form-remindertime').value =  $.fullCalendar.indertime,"yyyy-MM-dd HH:mm:ss");
206.                            ElementById('showtxt').style.display='block';
207.                        }else {
208.                        }
209.                        ElementById('form-color').value = lor;
210.                    },
211.                    okVal:'修改⽇程',
212.                    ok: function () {
213. var iframe = tWindow;
214. if (!iframe.document.body) {
215.                            alert('iframe还没加载完毕呢')
216. return false;
217.                        };
218.
219. var start = ElementById('form-start').value;
220. var end = ElementById('form-end').value;
221. var remindertime = ElementById('form-remindertime').value;
222.                        calEvent.title = ElementById('form-title').value;
223.                        calEvent.description = ElementById('form-description').value;
224.                        calEvent.start = $.fullCalendar.parseDate(start);
225.                        d = $.fullCalendar.parseDate(end);
226.                        lor = ElementById('form-color').value;
227. if (calEvent.title== '') {
228.                            alert("标题不能为空");
229. return false;
抗振压力表230.                          }else if(start== '') {
231.                            alert("开始⽇期不能为空");
231.                            alert("开始⽇期不能为空");
232. return false;
233.                          }else if(end == '') {
234.                            alert("结束⽇期不能为空");
235. return false;
236.                          }else if(ElementById('form-messagenotice').checked) {
237. if(remindertime == '') {
238.                                    alert("短信提醒时间不能为空");
239. return false;
240.                                }
241.                                ssagenotice = 1;
242.                                indertime = $.fullCalendar.parseDate(remindertime);
243.                            }else {
244.                                ssagenotice = 0;
245.                                indertime = null;
246.                            }
247.                        $.post("localhost:8080/pnote/schedule/updateevents",{//把要更新的⽇程计划信息传到后台，保存到数据库248.                                id:calEvent.id,
249.                                title: calEvent.title,
250.                                start:start,
251.                                end:end,
252.                                description:calEvent.description,
253.                                lor,
254.                                remindertime:remindertime,
255.                                ssagenotice
256.                            }
257.                        );
258.                        $('#calendar').fullCalendar('updateEvent', calEvent);
259. //弹出提⽰
260.                        ice({
261.                            title: '笔记之家',
262.                            width: 150,// 必须指定⼀个像素宽度值或者百分⽐，否则浏览器窗⼝改变可能导致artDialog收缩
263.                            content: '⽇程已更新！',
264.                            icon: 'face-smile',
265.                            time: 3
266.                        });
267. return true;
268.                    },
269.                    cancel: true,
270. //删除⽇程，保存到数据库
271.                    button: [{
272.                        name: '删除⽇程',
273.                        callback: function () {
274. //t('你同意了').time(2);
275.                              $.post("localhost:8080/pnote/schedule/deleteevents",{
276.                                id:calEvent.id
277.                              });
278.                            $('#calendar').fullCalendar('removeEvents',calEvent.id);
279.                            ice({
280.                                title: '笔记之家',
281.                                width: 150,// 必须指定⼀个像素宽度值或者百分⽐，否则浏览器窗⼝改变可能导致artDialog收缩
282.                                content: '⽇程已删除！',
283.                                icon: 'face-smile',
284.                                time: 3
285.                            });
286. return true;
287.                          }弹力玩具
288.                          }]
289.                    });
290.                }
291.            });
292.        });
293.
294. function showDetail(obj, e){
295. var str;
296. ssagenotice == 1)  str = "短信提醒时间："+$.fullCalendar.indertime,"yyyy-MM-dd HH:mm:ss");  297. else {str = "短信提醒未启动";}
298. var eInfo = '<div id="tip"><ul>';
299.        eInfo += '<li class="clock">' + '开始：'+$.fullCalendar.formatDate(obj.start,"yyyy-MM-dd HH:mm:ss") +'</br>结束：'+$.fullCalendar.d,"yyyy-MM-dd HH:mm:ss")+ '</li>';
300.        eInfo += '<li class="message">' +'⽇志：'+ obj.description + '<br/> </li>';
301. //eInfo += '<li>分类：' + obj.title + '</li>';
302.        eInfo += '<li class="postmessage">' + str + '<br/> </li>';
303.        eInfo += '</ul></div>';
304.        $(eInfo).appendTo($('body'));
305.        $('#tip').css({"opacity":"0.4", "display":"none", "left":(e.pageX + 20) + "px", "top":(e.pageY + 10) + "px"}).fadeTo(600, 0.9);  306. //⿏标移动效果
307.        $('.fc-event-inner').mousemove(function(e){
308.            $('#tip').css({'top': (e.pageY + 10), 'left': (e.pageX + 20)});
309.        });
310.    }
311.
312. </script>
313. <style type='text/css'>
314.
315.    body {

本文发布于:2024-09-22 05:27:08，感谢您对本站的认可！

本文链接：https://www.17tex.com/tex/4/346219.html

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。

上一篇：如何使用Outlook管理邮箱和日程安排
下一篇：行政助理的时间管理和日程安排技巧
标签：后台   不能   部分   保存   短信   提醒   信息   传到
留言与评论（共有 0 条评论）
   
验证码：
推荐文章
排行榜
热门标签
Copyright ©2019-2024 Comsenz Inc.Powered by © 易纺专利技术学习网 豫ICP备2022007602号 豫公网安备41160202000603 站长QQ:729038198 关于我们 投诉建议