fullCalendar应用

最新推荐文章于 2024-01-10 11:48:08 发布

zhangqiyi

最新推荐文章于 2024-01-10 11:48:08 发布

阅读量141

点赞数

文章标签： json java javascript ViewUI

本文链接：https://blog.csdn.net/zhangqiyi/article/details/84748656

版权

[{"allDay":false,"start":"2015-11-02 18:00","end":"2015-11-02 21:00","id":"1","title":"晚上练习"},{"allDay":false,"start":"2015-11-03 09:00","end":"2015-11-03 12:00","id":"2","title":"早上练习"},{"allDay":false,"start":"2015-11-04 14:00","end":"2015-11-04 16:00","id":"3","title":"下午练习"},{"allDay":false,"start":"2015-11-09 09:00","end":"2015-11-09 12:00","id":"5","title":"早上练习"}]

上面json格式代码

下面是jsp代码还有需要引用jquery-1.8.3.min.js

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/common/common.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<title>演示：FullCalendar应用——增删改数据操作</title>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/fullcalendar/css/fullcalendar.css">
<script src='${pageContext.request.contextPath }/js/fullcalendar/fullcalendar.min.js'></script>
<script src='${pageContext.request.contextPath }/js/fullcalendar/jquery.fancybox-1.3.1.pack.js'></script>
<script type="text/javascript">
$(function() {
	$('#calendar').fullCalendar({
		header: {
			left: 'prev,next today',
			center: 'title',
			right: 'agendaWeek'
			/* right: 'month,agendaWeek,agendaDay' */
		},
		defaultView:'agendaWeek',
		firstDay: 1,//从星期一开始
		events: '${pageContext.request.contextPath }/schedule/getCurrentWeek.do?coachId=1',
		dayClick: function(date, allDay, jsEvent, view) {
			var selDate =$.fullCalendar.formatDate(date,'yyyy-MM-dd');
			alert(jsEvent.id);
    	},
		eventClick: function(calEvent, jsEvent, view) {
			alert(calEvent.id);
    	}
	});
	
});

</script>
</head>

<body>


<div>
  
   <div id='calendar'></div>

</div>

</body>
</html>

在执行下一天和上一天时，插件自动调用url，同时把开始时间和结束时间一起传给后台

response.setContentType("text/html;charset=UTF-8"); 
		String jsonString="";
				
		//单位:秒
		String start=request.getParameter("start");
		String end=request.getParameter("end");		
		String startDate=MyDateUtils.getDate(Long.valueOf(start)*1000);
		String endDate=MyDateUtils.getDate(Long.valueOf(end)*1000);
		
		//选择教练
		String coachId=request.getParameter("coachId");
		
		Map params=new HashMap();
		params.put("startDate", startDate);
		params.put("endDate", endDate);
		params.put("coachId", coachId);
		
		List list=scheduleService.getCurrentWeek(params);
		if(list!=null&&list.size()>0){
			List nlist=new ArrayList();
			for(int i=0;i<list.size();i++){
				Schedule obj=(Schedule)list.get(i);
				Map map=new HashMap();
				map.put("id", String.valueOf(obj.getId()));
				map.put("title", obj.getName());
				map.put("start", obj.getFullDate()+" "+obj.getStarttime());
				map.put("end", obj.getFullDate()+" "+obj.getEndtime());
				map.put("allDay", false);
				nlist.add(map);
			}
			jsonString=JSON.toJSONString(nlist);
		}else{
			jsonString="{success:true,totalCounts:0,result:''}";
		}
		System.out.println(jsonString);
		response.getWriter().print(jsonString);
		return null;