easyui日历框架，与MySQL数据库联动，点击时可获取数据

原创已于 2024-07-02 09:42:10 修改 · 564 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#数据库 #easyui #mysql

于 2018-09-17 20:18:40 首次发布

我家APP 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了如何在easyui的日历框架中，通过点击日期触发事件，从MySQL数据库获取并显示当天数据。利用JavaScript和后台代码实现了这一功能，并强调了innerHTML属性在动态插入内容时的作用。

今天星期一，一周的新开始，我也突破了一些之前的障碍。

主页上使用了easyui的日历。想实现的功能是：点击日历的时间，可以在旁边的div中显示当天的事件。然后经过改良，这个功能可以实现出来了。

下面附上js代码和后台代码：

js：

$(document).ready(function(){
			$('#cc').calendar({
				current:new Date(),
			    onSelect: function(date){
					var data = date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate() ;
						$.ajax({
							type: "GET", //POST
							url: "getAllShuwu.action",
							data:{data:data},
							dataType: "json",
							success: function(data){
							if(data[0]==null){
								document.getElementById("iwoner").innerHTML = "无";
								document.getElementById("toupiaoshen").innerHTML = "无";
								document.getElementById("shenbao").innerHTML = "无";
								document.getElementById("shiWu").innerHTML = "无";
								document.getElementById("shiWuCon").innerHTML = "无";
								document.getElementById("shiWuDes").innerHTML = "无";
							}else{
								document.getElementById("iwoner").innerHTML = data[0].woner;
		                 		document.getElementById("toupiaoshen").innerHTML = data[0].toupiaoshenH;
		                        document.getElementById("shenbao").innerHTML = data[0].shenbaoShenH;
		                        document.getElementById("shiWu").innerHTML = data[0].shiwu;
		                        document.getElementById("shiWuCon").innerHTML = data[0].shiwuCon;
		                        document.getElementById("shiWuDes").innerHTML = data[0].shiwuDes;
					            }
							}
						});
			        /*alert(date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate()); */
					}
				});
			});

后台：

public void getAllShuwu(){
		HttpServletRequest request= ServletActionContext.getRequest();
		Session dbSession = HibernateSessionFactory.getSession();
		try{
		ShuwuDAO shuwuDAO = new ShuwuDAO();

        //查询的语句
		String data = request.getParameter("data");
		String tempSql="from Shuwu where time ='"+data+"'";
		Query tempQueryObject =dbSession.createQuery(tempSql);
		List allRead = tempQueryObject.list();
		
		JsonConfig jsonConfig = new JsonConfig();  //建立配置文件
		jsonConfig.setIgnoreDefaultExcludes(false);  //设置默认忽略
		jsonConfig.registerJsonValueProcessor(Date.class,new com.ps.utility.JsonDateValueProcessor());
		jsonConfig.setExcludes(new String[]{""}); 
		String json = JSONArray.fromObject(allRead,jsonConfig).toString();
	    ReturnMessage(json);
		}catch(Exception ex){
			ReturnMessage("FAILD:"+ex.getMessage());
		}finally{
			dbSession.disconnect();
			dbSession.close();
		}
 	}

这次的学习使我又新掌握了一个用法——innerHTML，他可以快速插入内容，简洁方便。