1.首先,页面引入easyUI文件
<link rel="stylesheet" href="/js/easyui/themes/default/easyui.css"> <link rel="stylesheet" href="/js/easyui/themes/icon.css"> <script type="text/javascript" src="/js/easyui/jquery.min.js"></script> <script type="text/javascript" src="/js/easyui/jquery.easyui.min.js"></script> <script type="text/javascript" src="/js/easyui/locale/easyui-lang-zh_CN.js"></script>
2.页面中js代码如下
<script type="text/javascript"> $(function(){ $("#stuTable").datagrid({ idField:'id', columns:[[ {field:'ck',checkbox:'true',width:10,align:'center'}, {field:'createTime',title:'申请日期',width:50,align:'center'}, {field:'xcode',title:'申请编号',width:50,align:'center'}, {field:'stucode',title:'发票号',width:50,align:'center'}, {field:'status',title:'状态',width:50,align:'center', formatter:function(value,row,index){ switch(value) { case 0: return '上学'; break; case 1: return '毕业'; break; case 2: return '入学'; break; default: return '查看'; } } }, {field:'operation',title:'操作',width:50,align:'left', formatter:function(value,row,index){ var a = '<a href="/showStu.htm?id='+row.id+'&Tid='+row.Tid+'" title="查看" >查看</a>'; if(row.status == -1){ } return a; } }, ]] }); }); function search() { var time1 = $('#beginTime').datebox('getValue'); var time2 = $('#endTime').datebox('getValue'); if(time1!=''&&time2!=''&&time2<time1) { $.messager.alert("警告!","结束时间必须大于开始时间"); return; } $('#stuTable').datagrid('load',{ beginTime:time1, endTime:time2, xcode:$('#xcode').val(), stucode:$('#stucode').val(), status:$('#stuStatus').val() }); } function clear(){ $('#beginTime').datebox('setValue',""); $('#endTime').datebox('setValue',""); $('#xcode').val(""); $('#stuCode').val(""); $('#stuStatus').val(""); } </script>
3.页面中html代码如下
<div > <ul> <li class="sc"> <label for="field"><span class="t2">申请日期</span></label> <input type="text" name="beginTime" id="beginTime" editable="false" class="easyui-datebox" style="width:100px; height:30px;"> </li> <li class="sc"> <label for="field" ><span class="t2">至</span></label> <input type="text" name="endTime" id="endTime" editable="false" class="easyui-datebox" style="width:100px; height:30px;"> </li> <li class="sc"> <label for="field" ><span class="t2">申请编号</span></label> <input type="text" name="xcode" id="xcode" style="width:140px;" > </li> <li class="sc"> <label for="field" ><span class="t2">学生号</span></label> <input type="text" name="stuCode'" id="stuCode'" style="width:150px;" > </li> <li class="sc"> <label for="field" ><span class="t2">状 态</span></label> <div class="select" style=" width:100px;"> <select name="status" id="status"> <option value="">全部</option> <option value="0" <c:if test="${param.stuStatus eq 0 }">selected</c:if>>上学</option> <option value="1" <c:if test="${param.stuStatus eq 1 }">selected</c:if>>毕业</option> <option value="2" <c:if test="${param.stuStatus eq 2 }">selected</c:if>>入学</option> </select> </div> </li> <li> <a href="javascript:void(0)" onclick="search()">搜索</a> <a href="javascript:void(0)" onclick="clear()">清空</a> </li> </ul> </div> <div class="t2"> <table id="stuTable" title="学生列表" url="/studentlistData.htm" pageList="[10,20]" singleSelect="true" fitColumns="true" pagination="true" pageSize="10" loadMsg="加载中···" rownumbers="true" fitColumns="true" > </table> </div>
4.后台springMVC的代码
@RequestMapping("/studentlistData.htm") public void studentlistData(HttpServletRequest request,HttpServletResponse response) throws Exception{ try { response.setHeader("Cache-Control", "no-cache"); response.setContentType("text/json;charset=UTF-8"); request.setCharacterEncoding("UTF-8"); String page = request.getParameter("page"); String rows = request.getParameter("rows"); if(StringUtils.isEmpty(from)){ from ="0"; } if(rows.equals("NaN")){ rows="1"; } List<Student> list = invoicedService.getStudentListByPage(con,(Integer.parseInt(page)-1)*Integer.parseInt(rows),Integer.parseInt(rows)); long count = invoicedService.getAllCount(con); JSONArray jarray = new JSONArray(); JSONObject jobject = new JSONObject(); jobject.put("total",count); if(!list.isEmpty()){ int index = 1; for (Student s : list) { SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd"); JSONObject jo = new JSONObject(); jo.put("id", s.getId()); jo.put("Tid", s.getTeacher().getId()); jo.put("createTime", sdf.format(stucode.getCreateTime())); jo.put("xcode", s.getXcode()); jo.put("stuCode",s.getStuCode()); jo.put("status", s.getStatus()); jo.put("rows",index); jarray.add(jo); index++; } jobject.put("rows",jarray); } PrintWriter out = response.getWriter(); out.print(jobject); out.flush(); out.close(); } catch (Exception e) { } }
相关推荐
mybatis+spring+springmvc+easyui做的一个登陆,增删改的项目实例,左侧菜单
SpringMvc和jquery-easyui项目,里边包含easyui的官方例子及中文文档
spring+springmvc+mybatis+easyui demo实例程序
mybati与springmvc,前端用的jquery easyui,学习实例,实现对数据的增删改查的功能,适合新手学习使用,mybati与springmvc,前端用的jquery easyui,学习实例,实现对数据的增删改查的功能,适合新手学习使用
spring4MVC+Hibernate4+easyui1.4 整合实例(全注解)。easyui常用的控件基本都涉及了。欢迎同道中人下载学习~~
使用springmvc、hibernate、maven开发的web实例项目。
Maven+Spring+SpringMVC+Mybatis+Log4j+EasyUI1.3.2+Oracle实例
此项目是maven2的项目,然后集成了springmvc框架,spring3框架,ibatis框架,freemarker和EasyUI。是我做好的,可以运行的项目,可以作为学习的参考资料或代码。
主要介绍了SpringMVC+EasyUI实现页面左侧导航菜单功能,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
包含easyUI的各种功能的一个实例。特别是动态编辑表格
Spring+SpringMVC+MyBatis+easyUI整合优化篇(四)单元测试实例
基于eclipse + easyUi1.2.6+common-fileupload + struts2实现带进度条的文件上传DEMO,具体效果跟思路可见我的博客:http://blog.csdn.net/jun55xiu/article/details/22042279
前台<pre><ul id="ttt" checkbox="true"></ul></pre>,js代码:<pre>function treeload(){ //树加载 $("#ttt").tree({ url:"tree_data2.do", }); },通过调用Springmvc从后台返回tree
OA项目,使用SSM框架开发,使用EASYUI前端AJAX的JSON传值实现,对数据进行合理封装。
spring MVC 整合hibernate开发实例,利用easyUI前端框架实现啦权限控制管理,堪称学习spring hibernate以及权限管理的完美教材,另付数据库脚本文件,方便测试。。。
easyui、eclipse、ibatIS、oracle等使用问题集锦,更有实例介绍
springmvc+spring+hibernate4+easyui实现的增删改查,通过hibernate可以对数据库进行建表操作,代码在eclipse和myeclipse都可以运行,包含jar文件
springMvc+hibernate4+spring整合实例 包内有对实例的crud 增删查改 分享此资源希望一起学习 若有什么不足之处 可以指出 谢谢
适用于初学者理解spring、springmvc、hibernate,使用oracle数据库,实现单表增删改查、条件查询和分页、文件上传
socket工具类,权限组件,菜单组件,jdbc分页支持多种数据库,ant路径工具类,增加jquery easyUI 1.0.9 版本管理,服务根路径工具类,文件上传工具类 1.0.10 集成ueditor在线编辑器 1.0.11 地址联动 1.0.12 Excel工具类 ...