struts2+dojo实现datagrid动态刷新
实现一个普通的数据库查询功能，参考了这个帖子：http://stackoverflow.com/questions/5499453/how-to-refresh-datagrid
需要注意的是动态创建DataGrid时，必须放在按钮的点击事件外，否则表格无法更新。
ACTION：
package cn.edu.just.action.configurationAction; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import cn.edu.just.Hibernate.POJO.ConfigurationDataTablePOJO.CmConfigurationInfo; import cn.edu.just.Hibernate.POJO.ConfigurationDataTablePOJO.CmWBS; import cn.edu.just.Hibernate.POJO.ConfigurationDataTablePOJO.CmWBSDAO; import cn.edu.just.Hibernate.POJO.PublicDataTablePOJO.ComDept; import cn.edu.just.Hibernate.POJO.PublicDataTablePOJO.ComDeptDAO; import cn.edu.just.bean.configuration.ConfigurationMaintaining; import com.opensymphony.xwork2.ActionSupport; public class ConfigurationMaintainingAction extends ActionSupport { private String equipName; private String identifier="name"; private String label="name"; private List<Map<String,Object>> items=new ArrayList<Map<String,Object>>(); public String execute() throws Exception{ items.clear(); if(equipName!=null){ ConfigurationMaintaining configurationMaintaining=new ConfigurationMaintaining(equipName); CmWBSDAO wbsDAO=new CmWBSDAO(); ComDeptDAO deptDAO=new ComDeptDAO(); Map<String,Object> mapItem=null; for(CmConfigurationInfo configInfo:configurationMaintaining.getConfigInfos()){ mapItem=new HashMap<String,Object>(); CmWBS wbs=wbsDAO.findById(configInfo.getWbsId()); mapItem.put("wbs", wbs.getWbs()); mapItem.put("configName",configInfo.getConfigName()); mapItem.put("locationName",configInfo.getLocationName()); ComDept dept=deptDAO.findById(configInfo.getDeptId()); mapItem.put("deptName",dept.getDeptName()); mapItem.put("status", configInfo.getStatus()); items.add(mapItem); } } return this.SUCCESS; } public String getIdentifier() { return identifier; } public void setIdentifier(String identifier) { this.identifier = identifier; } public String getLabel() { return label; } public void setLabel(String label) { this.label = label; } public List<Map<String,Object>> getItems() { return items; } public void setItems(List<Map<String,Object>> items) { this.items = items; } public String getEquipName() { return equipName; } public void setEquipName(String equipName) { this.equipName = equipName; } }
struts.xml(注意package要继承json-default):
<package name="getJSON" extends="json-default"> <action name="configurationMaintainingAction" class="cn.edu.just.action.configurationAction.ConfigurationMaintainingAction"> <result type="json" /> </action> </package>
JSP（DOJO的版本是：1.10.4）:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%@ taglib prefix="s" uri="/struts-tags" %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>My JSP 'configurationMaintaining.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <style type="text/css"> @import "/dojoroot/dijit/themes/tundra/tundra.css"; @import "/dojoroot/dojox/grid/resources/tundraGrid.css"; </style> <script src="/dojoroot/dojo/dojo.js" data-dojo-config="isDebug: 1, async: 1, parseOnLoad: 1"></script> <script> var grid, dataStore, store; require(["dojo/dom", "dojo/on", "dojo/request", "dojo/dom-form", "dojox/grid/DataGrid", "dojo/store/Memory", "dojo/data/ObjectStore", "dojo/domReady!"], function(dom, on, request, domForm,DataGrid,Memory, ObjectStore){ var form = dom.byId('formNode'); grid = new DataGrid({ query: { id: "*" }, id:"dataGrid1", structure: [ { name: "WBS", field: "wbs", width: "80px" }, { name: "配置项名称", field: "configName", width: "120px" }, { name: "位置名称", field: "locationName", width: "100px" }, { name: "设备所属部门", field: "deptName", width: "120px" }, { name: "状态", field: "status", width: "100px" } ] }, "gridDiv" ); grid.startup(); on(form, "submit", function(evt){ evt.stopPropagation(); evt.preventDefault(); request.post("configurationMaintainingAction.action", { data: domForm.toObject("formNode"), handleAs: "json" } ).then(function(data){ store = new Memory({ data: data.items }); dataStore = new ObjectStore({ objectStore: store }); grid.store = dataStore; grid._refresh(); } ); } ); } ); </script> </head> <body bgcolor="#bae87c" class="tundra"> <br /> <table width="600px" align="center"> <tr><td> <form id="formNode"><!-- action="configurationMaintainingAction.action" method="post" id="form1" --> <fieldset > <legend><font color="red"><b>查询</b></font></legend> <table width="100%"> <tr><td align="center" >系统/设备/部件 <input type="text" name="equipName" /></td> <td align="center">WBS <select style="width:156px;" name="configurationMaintaining.wbs"> <option value="----">———————————</option> <s:iterator value="wbsNames" var="wbsName"> <option value="${wbsName}"><s:property value="wbsName" /></option> </s:iterator> </select> </td> </tr> <tr><td></td><td align="center"><button type="submit" id="submitButton">查询</button></td> </table> </fieldset> </form> <br /> <form> <fieldset > <legend><font color="red"><b>配置信息</b></font></legend> <div id="gridDiv" style="width:100%;height: 200px;" > </div> </fieldset> </form> </td></tr> </table> </body> </html>
效果：
