日历实现

DAO日历，用查到单个年和单个月，与数据库里面的对比

/**
	 * 根据日期（年和月）查询备忘标题
	 *@return List<SysNotebook>
	 */
	@SuppressWarnings("unchecked")
	public List<Map<String,Object>>  getNotebookDay(String sYear,String sMonth){
	    String sql="select substr(to_char(deal_date,'yyyyMMdd'),7,2) as dealdate,note_title as notetitle from EG_T_SYS_NOTEBOOK where DEL_FLAG='N'";
	    String together="";
	    if(StringUtils.isNotEmpty(sYear)&&StringUtils.isNotEmpty(sMonth)){
	    	 if(Integer.parseInt(sMonth)<=9){//如果月小于10就在前面加0
	    		 together=sYear+"0"+sMonth;
	    	 }else{
	    		 together=sYear+sMonth;
	    	 }
	    	 sql+=" and substr(to_char(deal_date,'yyyyMMdd'),1,6)='"+together+"'"; 
	    }else{
	    	 sql+=" and substr(to_char(deal_date,'yyyyMMdd'),1,6)=substr(to_char(sysdate,'yyyyMMdd'),1,6)";
	    }
	    sql+="order by deal_date asc";
	    Query query=this.getSession().createSQLQuery(sql).setResultTransformer(Transformers.ALIAS_TO_ENTITY_MAP);//map
	    return query.list();
	}

manager里面，把同日的放在一起

    /**
     * 根据日期（年和月）查询备忘标题，重新整理map里面的标题
     *@param sYear
     *@param sMonth
     *@return
     *@throws Exception List<Map<String,Object>>
     */
    public List<Map<String,Object>> getNotebookDay(String sYear,String sMonth) throws Exception{
    	List<Map<String,Object>> listNew=new ArrayList<Map<String,Object>>();
    	String dealDate=null;
    	String title=null;
    	List<Map<String,Object>>  list=sysNotebookDao.getNotebookDay(sYear,sMonth);
    	for(Map<String,Object> map:list){
           if(StringUtils.isEmpty(dealDate)){//为空
        	   dealDate=String.valueOf(map.get("DEALDATE"));  //日期  			
               title="<span dispLength='18'>"+String.valueOf(map.get("NOTETITLE"))+"</span>"; 	  //主题
		   }else if(dealDate.equals(String.valueOf(map.get("DEALDATE")))){//日期相同
			   //dispLength 是显示长度18个字节，9个字
			   title+="<br/><span dispLength='18'>"+String.valueOf(map.get("NOTETITLE"))+"</span>";
		   }else{//第二次就来这了
			   Map<String,Object>  mapNew=new HashMap<String,Object>();
			   mapNew.put("dealDate", dealDate);
			   mapNew.put("title", title);
			   listNew.add(mapNew);
			   //为第二条更新日期和主题,日期不相等的，初始化
			   dealDate=String.valueOf(map.get("DEALDATE"));  //日期  			
               title="<span dispLength='18'>"+String.valueOf(map.get("NOTETITLE"))+"</span>"; 	  //主题
		   }
    	}
    	//解决最后一条list里面的数据
    	 Map<String,Object>  mapNew=new HashMap<String,Object>();
		   mapNew.put("dealDate", dealDate);
		   mapNew.put("title", title);
		   listNew.add(mapNew);
    	return listNew;
    }  
    

action里面的方法

	/**
	 * 根据日期（年和月）查询备忘标题，得到dealDate的日，格式是json字符串。
	 * void
	 * @throws Exception 
	 */
	public void getNotebookDay() throws Exception{
		dayList=sysNotebookManager.getNotebookDay(sYear,sMonth);
		ServletActionContext.getResponse().setCharacterEncoding("utf-8");
		PrintWriter out = ServletActionContext.getResponse().getWriter();
		out.println(JSONArray.fromObject(dayList).toString());//转换成json字符串
	}

jsp页面 写的ajax和显示日历

 <link href="${ctx}/common/utils/jCal/jCal.css" type="text/css" rel="stylesheet"/>
	<script src="${ctx}/common/utils/jCal/jCal.js" type="text/javascript"></script>
	<script src="${ctx}/common/utils/jCal/jquery.animate.clip.js" type="text/javascript"></script>
	<script src="${ctx}/common/utils/datePicker/WdatePicker.js" type="text/javascript" language="javascript"></script>
	<script type="text/javascript">
		var resultValueObj;//初始化json对象
		var sYear;//选择年
		var sMonth;//选择月
	//ajax返回json字符串
function ajaxDay(sYear,sMonth){
	 var resultValue=$.ajax({
		 async: false,
		 type: "GET",
		 url: "sys-notebook!getNotebookDay.action",
		 data: "sYear="+sYear+"&sMonth="+sMonth,
		 success : function(data){//json对象
		 }
   }).responseText;
   resultValueObj=eval("("+resultValue+")");
}
   //日历显示
function calendar(){
	$('#calTwo').jCal({ 
		day: new Date(),//初始日期设置，一般是当前的，所以填写为new Date()
		days: 1,
		showMonths: 1,
		monthSelect:true,
		sDate: new Date(),
		dCheck: function (day) { 
		return (true);
		},
		callback:function (day, days){
		       yearAll=day.getFullYear();
		       monthAll=day.getMonth()+1;
			$('#calTwoResult').click(bb(day));
		   function bb(day){ 
		      var year=day.getFullYear();
		      var month=day.getMonth();
		      var date=day.getDate();
			window.location.href="sys-notebook!detail.action?getFullYear="+year+"&getMonth="+(month+1)+"&getDay="+date+"";
			}
		   return true;
		},
		dayOffset:0,
		dow: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
		ml: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
	});
}
	</script>
</head>
<body id="body" onload="calendar();">
<div id="calOne">
</div>
<div id="calTwo">
</div>
</body>
</html>

 

引用js的更改

	function drawCalControl (target, opt) {
……………………
……………………


                      sYear=opt.day.getFullYear();
		       sMonth=opt.day.getMonth()+1;
		ajaxDay(sYear,sMonth);//调用ajax去得到json对象
}




function drawCal(target, opt) {

……
for ( var d = offsetDayStart, dE = ( copt.fd + copt.ld + ( 7 - offsetDayEnd ) ); d < dE; d++){
			 //d  35个格子
			 //dE 36
			 //copt.fd==1    		  copt.ld==31
			 //offsetDayStart==周1    offsetDayEnd==周3
			 //opt.dayOffset==0
			 var title="";
			 for(var i=0;i<resultValueObj.length;i++){
				if(resultValueObj[i].dealDate==(d - ( copt.fd - opt.dayOffset ))){
					title='<br/>'+resultValueObj[i].title;
				}
			 }
		 	$(target).append(
			(( d <= ( copt.fd - opt.dayOffset ) ) ? 
				'<div id="' + opt.cID + 'd' + d + '" class="pday">' + ( copt.lld - ( ( copt.fd - opt.dayOffset ) - d ) ) + '</div>' 
				: ( ( d > ( ( copt.fd - opt.dayOffset ) + copt.ld ) ) ?
					'<div id="' + opt.cID + 'd' + d + '" class="aday">' + ( d - ( ( copt.fd - opt.dayOffset ) + copt.ld ) ) + '</div>' 
					: '<div id="' + opt.cID + 'd_' + (fd.getMonth() + 1) + '_' + ( d - ( copt.fd - opt.dayOffset ) ) + '_' + fd.getFullYear() + '" class="' +
						( ( opt.dCheck( new Date( (new Date( fd.getTime() )).setDate( d - ( copt.fd - opt.dayOffset ) ) ) ) ) ? 'day' : 'invday' ) +
						'">' +( d - ( copt.fd - opt.dayOffset ) )+title+'</div>'
					) 
				)
			);
		}
}