json的后台数据无法传到前台的Ext.data.store中
这是我调用json数据的Message.jsp<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<%@ page import="com.ebig.bean.*"%>
<%@ page import="com.ebig.function.*"%>
<%@ page import="com.ebig.util.*"%>
<%@ page import="java.util.ArrayList.*"%>
<%@ page
import="java.util.List.*,net.sf.json.JSONArray,net.sf.json.JSONObject;"%>
<%
List<Student> studentInfo;
StudentMrg smg = new StudentMrg();
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<%
JSONArray json = smg.getJsonArray(smg.getStudentList());
String data="{root:"+json.toString()+"}";
// response.getWriter().write(data);
out.write(data);
%>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>Insert title here</title>
</head>
<body>
这个是Message.jsp刷出的json数据
{root:[{"age":23,"id":1,"name":"张三","sex":"男","tellphone":3.3535253535E10},{"age":20,"id":2,"name":"李四","sex":"女","tellphone":2.2344234343E10},{"age":21,"id":3,"name":"王五","sex":"男","tellphone":6.7622354454E10},{"age":22,"id":4,"name":"赵六","sex":"女","tellphone":3.4880388934E10},{"age":21,"id":5,"name":"啊啊","sex":"男","tellphone":2.3343883849E10},{"age":19,"id":6,"name":"哈德森","sex":"女","tellphone":3.8948984895E10},{"age":25,"id":7,"name":"月夜枫","sex":"男","tellphone":4.3584850485E10},{"age":17,"id":8,"name":"额居然","sex":"女","tellphone":8.3494832844E10},{"age":19,"id":9,"name":"海德堡","sex":"男","tellphone":8.9489895495E10},{"age":24,"id":10,"name":"钛合金","sex":"女","tellphone":5.6980058586E10}]}
这个是我前台的index.jsp的代码
var reader = new Ext.data.JsonReader({
// totalProperty : "totalProperty",// totalRecords属性由json.results得到
root : "root", // 构造元数据的数组由json.rows得到
// id : "rownum_", // id由json.id得到
fields: [
{name: 'id'},
{name: 'name'},
{name: 'sex'},
{name: 'age'},
{name: 'tellphone'}
]
});
// 构建Store
var ds = new Ext.data.Store({
url:'http://localhost/MyExtGridTest/Message.jsp',
reader : reader
});
ds.load();//初始化数据
alert(ds.getCount());
不知道为什么json数据始终传不过来，老是提示ds中的数据个数是0；求高手帮忙解决下
--------------------编程问答-------------------- url和reader放到proxy里 --------------------编程问答-------------------- 好像也没用依旧提示没0
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel="stylesheet" type="text/css"
href="ExtJS/resources/css/ext-all.css" />
<script type="text/javascript" src="ExtJS/adapter/ext/ext-base.js">
</script>
<script type="text/javascript" src="ExtJS/ext-all.js">
</script>
<script type="text/javascript">
Ext.onReady(function() {
var sm = new Ext.grid.CheckboxSelectionModel();
var cm = new Ext.grid.ColumnModel([ sm, {
header : '编号',
id : 'id',
dataIndex : 'id',
editor : new Ext.grid.GridEditor(new Ext.form.NumberField({
allowBlank : false,
allowNegative : false,//不能输入减号
maxValue : 10000
}))
}, {
header : '姓名',
id : 'name',
dataIndex : 'name',
editor : new Ext.grid.GridEditor(new Ext.form.TextField({
allowBlank : false
}))
}, {
header : '性别',
id : 'sex',
dataIndex : 'sex',
editor : new Ext.grid.GridEditor(new Ext.form.TextField({
allowBlank : false
}))
}, {
header : '年龄',
id : 'age',
dataIndex : 'age',
editor : new Ext.grid.GridEditor(new Ext.form.TextField({
allowBlank : false
}))
}, {
header : '电话',
id : 'tellphone',
dataIndex : 'tellphone',
editor : new Ext.grid.GridEditor(new Ext.form.TextField({
allowBlank : false
}))
} ]);
var reader = new Ext.data.JsonReader({
totalProperty : "results",// totalRecords属性由json.results得到
root : "root"// 构造元数据的数组由json.rows得到
},[
{name: 'age'},
{name: 'id'},
{name: 'name'},
{name: 'sex'},
{name: 'tellphone'}
]
);
// 构建Store
var ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'http:///localhost//MyExtGridTest//Message.jsp'}),
reader:reader
});
ds.load({params:{start:0,limit:10}});//初始化数据
alert(ds.getCount());
var myrecord = Ext.data.Record.create([ {
name : 'id',
type : 'string'
}, {
name : 'name',
type : 'string'
}, {
name : 'sex',
type : 'string'
}, {
name : 'age',
type : 'string'
}, {
name : 'tellphone',
type : 'string'
} ]);
var grid = new Ext.grid.EditorGridPanel({
autoHeight : true,
renderTo : Ext.getBody(),
height : 300,
store : ds,
cm : cm,
sm : sm,
bbar : new Ext.PagingToolbar({
pageSize : 10, //每页显示10条数据
ds : ds,
displayInfo : true, //显示数据信息
displayMsg : '显示第 {0} 条到 {1} 条记录，一共 {2} 条',
emptyMsg : "没有记录" //没有数据时显示的信息
}),
tbar : [
{
id : 'save',
text : '保存',
handler : function() {
var record = grid.getStore().modified[0]; //获得store中修改过得数据
var data = [];
Ext.each(record, function(item) {
data.push(item.data); //把修改过得数据放到data中
});
alert(Ext.encode(data));
Ext.lib.Ajax.request( //使用Ajax请求提交给后台
'POST', 'SaveData', {
success : function(response) { //返回成功
Ext.Msg.alert('信息', response.responseText,
function() {
store.reload();
});
},
failure : function() { //返回失败
Ext.Msg.alert("错误", "服务器保存数据出错！");
}
}, 'row=' + encodeURIComponent(Ext.encode(data)));
}
}, {
id : 'reflesh',
text : '刷新',
handler : function() {
alert("总共有" + ds.getCount() + "条数据");
}
}, {
id : 'add',
text : '添加行',
handler : function() {
var p = new myrecord({
id : '',
stuname : '',
sex : '',
brith : ''
});
//grid.stopEditing(); //关闭表格的编辑状态
ds.insert(0, p); //创建的Record插入store的第一行
// grid.startEditing(0,0) //激活第一行第一列的编辑状态
}
}, {
id : 'delete',
text : '删除行',
handler : function() {
Ext.Msg.confirm('提示', '是否要删除', function(btn) {
if (btn == 'yes') {
var model = grid.getSelectionModel();
/**
* AbstractSelectionModel类有两个子类CellSelectionModel, RowSelectionModel-->CheckboxSelectionModel
* 对于EditorGridPanel获取的应该是CellSelectionModel的对象，那么就可以调用它的
* getSelectedCell()来获取选中的格子的数组的位置
*/
var cell = model.getSelections();//这个是获取选中的格子在数组中的位置，如：[0,1],以数组的形式表示
for ( var i = 0; i < cell.length; i++) {
ds.remove(cell[i]);
}
//grid.view.refresh();
} else {
alert("删除失败");
}
})
}
} ],
trackMouseOver : true,//鼠标滑过时的高亮效果
clicksToEdit : 2
//表示点击一次单元格即触发编辑 ,默认情况下该值为2
});
})
</script>
</head>
<body>
</body>
</html>
--------------------编程问答-------------------- var departMentStore = new Ext.data.JsonStore({
root: "result",
fields: ['name','value'],
url: "<c:url value='/combox/getDepartMentInfo'/>"
});
这样即可。。。 --------------------编程问答-------------------- 我记得extjs的ajax接受返回json的时候得有个success值，先判断success是true还是false，才会走extjs里的success。
补充：Java , Web 开发
