FullCalendar 的学习笔记（二）
下面是一个.NET webForm的具体列子
注意引用了artDialog 以及异步请求数据的json格式字符串
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<link href='fullcalendar/fullcalendar.css' rel='stylesheet' />
<link href='fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print' />
<script type="text/javascript" src='fullcalendar/lib/jquery-1.10.2.min.js'></script> <script type="text/javascript" src='fullcalendar/lib/jquery-ui.custom.min.js'></script>
<script type="text/javascript" src='fullcalendar/fullcalendar.min.js'></script>
<script type="text/javascript" src="artDialog/artDialog.source.js?skin=default"></script>
<script type="text/javascript" src="artDialog/plugins/iframeTools.source.js"></script>
<script src="urlParams.js" type ="text/javascript"></script> <script type="text/javascript"> var newdate;//定义一个时间
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'
},
monthNames: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
monthNamesShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
dayNames: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
dayNamesShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
today: ["今天"],
firstDay: 1,
buttonText: {
today: '今天',
month: '月',
week: '周',
day: '日'
},
editable: false,
timeFormat: 'HH:mm',
axisFormat: 'HH:mm',
viewDisplay: function(view) {
newdate=$.fullCalendar.formatDate(view.start,"yyyy-MM-dd HH:mm:ss"); }, events: function (start, end, callback) {
var t1=$.fullCalendar.formatDate(start, "yyyy-MM-dd hh:mm:ss")
var t2=$.fullCalendar.formatDate(end, "yyyy-MM-dd hh:mm:ss")
$.ajax({
type: "get",
async: false,
url: "GetDutyAction.ashx?tmp=" + (new Date()).valueOf(),
data: { start: t1, end: t2 },
success: function (data) {
var date = jQuery.parseJSON(data); //此处虽然allDay有值但是 由于是字符串false 而不是关键字false 默认显示整日
callback(date); <!-- 还有一种加载方式
obj=jQuery.parseJSON(data);
for(var i=0;i<obj.length;i++)
{
var newobj = new Object();
newobj.title=obj[i].title
....
$('#calendar').fullCalendar('renderEvent', newobj); //核心的更新代码
}
-->
} });
}, dayClick: function (date, allDay, jsEvent, view) { var obj = new Object();
art.dialog.open('DutyEdit.aspx', { //duty自由定义只需要设置需要返回值的一些控件
title: '添加值班',
lock: true,
width: 550,
height: 340,
fixed: true, //固定定位
opacity: 0.6, // 透明度
// 在open()方法中，init会等待iframe加载完毕后执行
init: function () {
var iframe = this.iframe.contentWindow;
var top = art.dialog.top;// 引用顶层页面window对象
if(date.getDate()==1 )
{
iframe.document.getElementById('tr_ld').style.display="";
}
var start = iframe.document.getElementById('txt_date');
start.value = $.fullCalendar.formatDate(date, "yyyy-MM-dd");
},
okVal: '提交值班',
ok: function () {
var iframe = this.iframe.contentWindow;
if (!iframe.document.body) {
alert('iframe还没加载完毕呢');
return false;
}; var amuser=iframe.document.getElementById('txt_AMUser').value; var starttime = iframe.document.getElementById('txt_date').value; $.ajax({
type: "get",
async: false,
url: "SetDutyAction.ashx",
data: { user:amuser,start:starttime,type:'0'},
success: function (data) {
obj=jQuery.parseJSON(data);
} });
//此处我是需要插入多条值班信息
if(obj.length>0)
{
for(var i=0;i<obj.length;i++)
{
$('#calendar').fullCalendar('renderEvent', obj[i]); //核心的更新代码
}
} $('#calendar').fullCalendar('unselect');
art.dialog({
title: '提醒',
width: 150,// 必须指定一个像素宽度值或者百分比，否则浏览器窗口改变可能导致artDialog收缩
content: '值班添加至后台！',
icon: 'face-smile',
time: 1
});
return true;
},
cancel: true
});
},
eventClick: function (calEvent, jsEvent, view) { art.dialog.open('DutyEdit.aspx', {
title: '更新日程',
lock: true,
width: 550,
height: 340,
//background: '#600', // 背景色
opacity: 0.6, // 透明度
// 在open()方法中，init会等待iframe加载完毕后执行
init: function () {
var iframe = this.iframe.contentWindow;
var top = art.dialog.top;// 引用顶层页面window对象
iframe.document.getElementById('txt_date').value=$.fullCalendar.formatDate(calEvent.start, "yyyy-MM-dd"); },
okVal: '修改值班',
ok: function () { var iframe = this.iframe.contentWindow;
if (!iframe.document.body) {
alert('iframe还没加载完毕呢')
return false;
}; calEvent.dutyuser=iframe.document.getElementById('txt_User').value ;
calEvent.title="上午值班："+calEvent.dutyuser;
calEvent.dutyUid=iframe.document.getElementById('Hidden1').value if (calEvent.dutyuser == '') {
alert("人员不能为空");
return false;
}
$.ajax({
type: "get",
async: false,
url: "SetDutyAction.ashx",
data: { id:calEvent.id,name:calEvent.dutyuser,userid:calEvent.dutyUid,type:'1'},
success: function (data) {
} });
$('#calendar').fullCalendar('updateEvent', calEvent);
////弹出提示
art.dialog({
title: '提醒',
width: 150,// 必须指定一个像素宽度值或者百分比，否则浏览器窗口改变可能导致artDialog收缩
content: '值班已更新！',
icon: 'face-smile',
time: 1
}); return true;
},
cancel: true,
//删除日程，保存到数据库
button: [{
name: '删除日程',
callback: function () {
$.ajax({
type: "get",
async: false,
url: "SetDutyAction.ashx", //.net ajax异步请求删除数据库数据
data: { id:calEvent.id,type:'2'},
success: function (data) {
} });
$('#calendar').fullCalendar('removeEvents', calEvent.id);
art.dialog({
title: '提醒',
width: 150,// 必须指定一个像素宽度值或者百分比，否则浏览器窗口改变可能导致artDialog收缩
content: '值班已删除！',
icon: 'face-smile',
time: 1
});
return true;
}
}]
});
}
});
}); </script>
<style type="text/css"> body {
margin-top: 40px auto;
text-align: center;
font-size: 14px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
} #calendar {
width: 900px;
margin: 0 auto;
} </style>
</head>
<body>
<form id="form1" runat="server">
<div ><span id="title" style="font-size:25px; font-weight:bolder;">值班表</span></div>
<div id='calendar'></div> </form>
</body>
</html>
DataSet ds = db.ExecuteDataSet(dbcom);
if (ds.Tables[].Rows.Count > )
{
DateTime start1 = DateTime.Parse(dr["StartDate"].ToString());
DateTime end1 = DateTime.Parse(dr["EndDate"].ToString());
result += "{\"id\":\"" + dr["ID"].ToString() + "\",\"title\":\"" + title + "\",\"dutyuser\":\"" + dr["DutyUser"].ToString() + "\",\"dutyUid\":\"" + dr["DutyUserID"].ToString() + "\",";
result += "\"start\":\"" + start1.ToString("yyyy-MM-dd hh:mm:ss") + "\",\"end\":\"" + end1.ToString("yyyy-MM-dd hh:mm:ss") + "\",\"status\":\"" + dr["Status"].ToString() + "\",\"allDay\":\"false\"" + color + "},";
}
result = result.TrimEnd(',') + "]";
}
FullCalendar 的学习笔记（二）的更多相关文章
- WPF的Binding学习笔记(二)
原文: http://www.cnblogs.com/pasoraku/archive/2012/10/25/2738428.htmlWPF的Binding学习笔记(二) 上次学了点点Binding的 ...
- AJax 学习笔记二(onreadystatechange的作用)
AJax 学习笔记二(onreadystatechange的作用) 当发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态XMLHttpRequest对象提供了on ...
- [Firefly引擎][学习笔记二][已完结]卡牌游戏开发模型的设计
源地址:http://bbs.9miao.com/thread-44603-1-1.html 在此补充一下Socket的验证机制:socket登陆验证.会采用session会话超时的机制做心跳接口验证 ...
- JMX学习笔记(二)-Notification
Notification通知,也可理解为消息,有通知,必然有发送通知的广播,JMX这里采用了一种订阅的方式,类似于观察者模式,注册一个观察者到广播里,当有通知时,广播通过调用观察者,逐一通知. 这里写 ...
- java之jvm学习笔记二(类装载器的体系结构)
java的class只在需要的时候才内转载入内存,并由java虚拟机的执行引擎来执行,而执行引擎从总的来说主要的执行方式分为四种, 第一种,一次性解释代码,也就是当字节码转载到内存后,每次需要都会重新 ...
- Java IO学习笔记二
Java IO学习笔记二 流的概念 在程序中所有的数据都是以流的方式进行传输或保存的,程序需要数据的时候要使用输入流读取数据,而当程序需要将一些数据保存起来的时候,就要使用输出流完成. 程序中的输入输 ...
- 《SQL必知必会》学习笔记二)
<SQL必知必会>学习笔记(二) 咱们接着上一篇的内容继续.这一篇主要回顾子查询,联合查询,复制表这三类内容. 上一部分基本上都是简单的Select查询,即从单个数据库表中检索数据的单条语 ...
- NumPy学习笔记 二
NumPy学习笔记 二 <NumPy学习笔记>系列将记录学习NumPy过程中的动手笔记,前期的参考书是<Python数据分析基础教程 NumPy学习指南>第二版.<数学分 ...
- Learning ROS for Robotics Programming Second Edition学习笔记(二) indigo tools
中文译著已经出版,详情请参考:http://blog.csdn.net/ZhangRelay/article/category/6506865 Learning ROS for Robotics Pr ...
- Redis学习笔记二 （BitMap算法分析与BitCount语法）
Redis学习笔记二 一.BitMap是什么 就是通过一个bit位来表示某个元素对应的值或者状态,其中的key就是对应元素本身.我们知道8个bit可以组成一个Byte,所以bitmap本身会极大的节省 ...
随机推荐
- table细线
table { border-collapse: collapse; } table td { border: 1px solid #CCCCCC; }
- pfile，spfile 初始化参数文件顺序【weber出品】
一.初始化参数文件 启动实例时会读取初始化参数文件.参数文件有两种类型: 1.服务器参数文件:这是首选类型的初始化参数文件.这是一个由数据库服务器写入或读取的二进制文件,不得手动进行编辑.此文件驻留在 ...
- 4 常量类--Map常量
public static final HashMap<String, String> ETL_SOURCE_INPUTTYPE_MAP = new HashMap<String, ...
- poj 1190 DFS 不等式放缩进行剪枝
F - (例题)不等式放缩 Time Limit:1000MS Memory Limit:10000KB 64bit IO Format:%I64d & %I64u Submi ...
- 洛谷 P1896 互不侵犯King
P1896 [SCOI2005]互不侵犯King 题目描述 在N×N的棋盘里面放K个国王,使他们互不攻击,共有多少种摆放方案.国王能攻击到它上下左右,以及左上左下右上右下八个方向上附近的各一个格子,共 ...
- RCP打包出来 运行 出现 JVM terminated.exit code = 13
在建立PM.product,即打包时,没有添加相应的插件,导致无法运行
- C语言内存分配函数
c语言标准库提供了3个内存分配的函数,都包含在头文件<stdlib.h>中 1.malloc 函数原型: void *malloc( size_t size ); 参数:要分配内存大小的字 ...
- mvc上传，下载，浏览文件功能（用uploadify插件）
类 public class UpLoadFileController : Controller { // // GET: /UpLoadFile/ public ActionResult Index ...
- Java语言中有4种访问修饰符
转载:http://wuhaidong.iteye.com/blog/851754 Java语言中有4种访问修饰符 在Java语言中有4中访问修饰符:package(默认).private.publi ...
- Linux中重命名文件
linux下重命名文件有两种方式: 1.较简单的处理命令:mv mv 原文件名 新文件名 如:mv myFile newName 将MyFile重命名为newName. 2.linux提供了一个重命名 ...