+ -
当前位置:首页 → 问答吧 → ssh 和ExtJs 4.0 Girid空件使用 怎样进行 前后台数据交互

ssh 和ExtJs 4.0 Girid空件使用 怎样进行 前后台数据交互

时间:2011-12-01

来源:互联网

前台js

 //定义数据模型  
 Ext.define('MyData',{  
  extend: 'Ext.data.Model',  
  fields: [  
  //第一个字段需要指定mapping,其他字段,可以省略掉。  
  {name:'id',mapping:'0'},  
  {name:'name',mapping:'1'} 
  ]
  }); 
  //定义数据源
  var dataStrores= Ext.create('Ext.data.Store', {  
  storeId : 'simpdata',
  model: 'MyData',  
  // data: [ 这种方式可以显示数据
  // { id: 'Lisa', name: '[email protected]' },
  // { id: 'Bart', name: '[email protected]'},
  // { id: 'Homer', name: '[email protected]'},
  // { id: 'Marge', name: '[email protected]'}
  // ],
 
  proxy: {  
  //异步获取数据,这里的URL可以改为任何动态页面,只要返回JSON数据即可  
  type: 'ajax',  
  url:"DepartmentAction!selects",
  reader: {  
  type: 'json',
  root: 'items'
  //totalProperty : 'total'  
  }  
  },  
  autoLoad: true  
  });  
 //定义 grid控件
  Ext.Msg.alert(dataStrores+"sd");
Ext.create('Ext.grid.Panel', {
renderTo : "right",
width : "800px",
height : "580px",
waitMsgTarget : true, 
title : '部门添加', 
store : dataStrores,
columns : [{
header : '部门编号',
dataIndex : 'id',
width: 100
}, {
header : '部门名称',
dataIndex : 'name',
width: 300  
}]  
   
}); 

后台数据。
public String selects() throws BussinessException { 
JSONArray json = new JSONArray();
try {
List<Department> lists = departmentService.allDepartment();
for (int i = 0; i < lists.size(); i++) {
Department depar = lists.get(i); //实体类
JSONArray js = new JSONArray();
js.put(depar.getId());
js.put(depar.getName());
json.put(js);

((PrintWriter) getHttpServletResponse().getWriter()).print(json);

} catch (Exception e) {
e.printStackTrace();
super.getHttpServletRequest().setAttribute("MSG", "没有找到相关的信息!");

  return "";
}

作者: hw13531   发布时间: 2011-12-01

用jsonStore,在组件初始化完成之后,调用这个jsonStore人load()方法,只要后台的数据封装没错误,前面的grid就会显示数据了

作者: yajiehanyang   发布时间: 2011-12-01

这个是 Strits的配置:
<package name="regionPackage" extends="json-default">
<action name="DepartmentAction" class="DepartmentAction">
<result type="json"></result>
</action>
</package>

作者: hw13531   发布时间: 2011-12-01

 
  dataStrores.load(); 这个方法加了,但是还是出不来。不知道是不是我封装的问题,您用Extjs 4.0 后台是怎样封装,传递到前台extjs中的。

作者: hw13531   发布时间: 2011-12-01