我如何把图片传上来
今天的任务就是从后台取出数据,然后一行一行的在页面展现出来,如上图所示,这是我使用Ext的第一步.
应该说这个步骤很简单,但它却花了我不少的时间!
客户端如下:
<%@ page contentType="text/html; charset=gbk" language="java"%>
<%@ include file="/include/jsp_headers.jsp"%>
<html>
<head>
<title>dictypeList</title>
<%@ include file="/include/Ext_Js_Css.jsp" %>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="ext/customs/grid-examples.css" />
<link rel="stylesheet" type="text/css" href="ext/customs/examples.css" />
<script>
var Grids=function(){
return {
init:function(){
Ext.QuickTips.init();
// turn on validation errors beside the field globally
Ext.form.Field.prototype.msgTarget = 'side';
this.store=new Ext.data.Store({
proxy:new Ext.data.HttpProxy({url:'extdictypeList.do?method=extdictypeList'}),
reader:new Ext.data.JsonReader(
{totalProperty:'cs',root:'rs',id:"dictypeoid"},
[{name:'dicTypeOid',type:'float'},{name:'dicTypeCode',type:'string'},
{name:'dicTypeName',type:'string'},{name:'displayOrder',type:'float'},
{name:'remark',type:'string'}
]
),
remoteSort : true
});
this.store.setDefaultSort('dicTypeCode');
this.store.load({ params:{ start : 0, limit : 10 } });
var sm = new Ext.grid.CheckboxSelectionModel();
var ccm = new Ext.grid.ColumnModel([
sm,
{id:'dicTypeOid',header : "类OID",dataIndex : 'dicTypeOid',sortable: true,width : 50},
{header : "类编码",dataIndex : 'dicTypeCode',sortable: true,width :50},
{header : "类名",dataIndex : 'dicTypeName',sortable: true,width : 100},
{header : "排序",dataIndex : 'displayOrder',sortable: true,width : 50},
{header : "备注",dataIndex : 'remark',sortable: true,width : 300}
]);
ccm.defaultSortable = true;
this.grid = new Ext.grid.GridPanel({
el:'htmlGridPanel',ds : store,cm : ccm,sm : sm,
viewConfig: {forceFit:true},
height:350,width:900,frame:true,
bbar: new Ext.PagingToolbar({
pageSize: 10,
store: store,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display"
})
});
grid.render();
}
};
}();
Ext.onReady(Grids.init);
function deldata(){
alert(document.getElementsByName("dicTypeOid"));
}
</script>
</head>
<body>
<div>
<input type="button" value="删除" onClick="deldata()"/>
</div>
<div id="htmlGridPanel"></div>
</body>
</html>
java代码:
public ActionForward extdictypeList(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response)
throws Exception {
response.setContentType("text/html;charset=gb2312");
request.setCharacterEncoding("gb2312");
Enumeration eun=request.getParameterNames();
while(eun.hasMoreElements()) {
log.info(eun.nextElement());
}
String sortfield=request.getParameter("sort");
String asc=request.getParameter("dir");
int start=Integer.valueOf(request.getParameter("start"));
int limit=Integer.valueOf(request.getParameter("limit"));
TableTagBean ttb = TableTagBean.getFromRequest(request);
ttb.setPage(start);
ttb.setPageSize(limit);
ttb.setOrderBy(sortfield);
log.info("dir:"+request.getParameter("dir"));
if("ASC".equals(asc)) {
ttb.setAsc(true);
}else {
ttb.setAsc(false);
}
if (request.getMethod().equals("POST")) {
Map map = PropertyUtils.describe(form);
ttb.getCondition().copyFrom(map, true);
} else {
form = new DicTypeForm();
BeanUtils.populate(form, ttb.getCondition());
request.setAttribute("dictypeForm", form);
}
try {
// List<DicType> list = dictypeFacade.findDicTypeListByCondition(ttb
// .getCondition(), start, limit, ttb.getOrderBy(), ttb.getAsc());
List<DicType> list = dictypeFacade.findDicTypeListByCondition(ttb);
// ttb.setTotal(dictypeFacade.countDicTypeByCondition(ttb.getCondition()));
// ttb.setList(list);
// request.setAttribute("bean", ttb);
// request.setAttribute("dictypes", returnJsonString(list));
StringBuilder sb = new StringBuilder();
JSONObject obj = new JSONObject();
JSONArray array = new JSONArray();
obj.put("cs", ttb.getTotal());
// log.info("size"+list.size());
int i=0;
for (DicType dictype : list) {
JSONObject obj1 = new JSONObject();
obj1.put("dicTypeOid", dictype.getDicTypeOid());
obj1.put("dicTypeCode", dictype.getDicTypeCode());
obj1.put("dicTypeName", dictype.getDicTypeName());
obj1.put("remark", dictype.getRemark());
Double displayorder = dictype.getDisplayOrder();
if (displayorder == null || displayorder == 0) {
displayorder = new Double(9999);
}
obj1.put("displayOrder", displayorder);
array.put(obj1);
i++;
}
obj.put("rs", array);
sb.append(obj);
// log.info(sb.toString());
response.getWriter().print(sb.toString());
} catch (ServiceException se) {
handleException(request, se, null);
return mapping.findForward("fail");
}
return null;
}