搞了很久，就是不出数据，快崩溃了，action中System.out.println();没问题，json的格式也是正确的，但在js里面就是死活取不到，请大家帮忙看看，谢谢了！！
js:
Ext.onReady(function(){
var ds = new Ext.data.JsonStore({
proxy : new Ext.data.HttpProxy({url:'List.action',method:'POST'}),
reader: new Ext.data.JsonReader({
successProperty: "successproperty",
totalProperty: 'totalProperty',
root: 'root',
fields: [
'userId','userName','password','email'
]
})
});
//alert(ds.getCount()) ;
//alert(ds.getAt(0).get("userName")) ;
var colModel = new Ext.grid.ColumnModel([
{id:'title',header:'ID',width:50,sortable:true,dataIndex:'userId'},
{header:'用户名', width:100,sortable:true,dataIndex:'userName'},
{header:'密码明码',width:100,sortable:true,dataIndex:'password'},
{header:'电子邮件',width:100,sortable:true,dataIndex:'email'}
]);
var tb = new Ext.Toolbar("north-div");
tb.add({
text: '添加',
tooltip:'Add a new row',
iconCls:'add',
handler: newUser
},{
text: '编辑',
tooltip:'edit a new row',
iconCls:'option',
handler: editUser
},{
text: '删除',
tooltip:'delete a new row',
iconCls:'remove',
handler: delUser
});
var grid = new Ext.grid.GridPanel({
border:false,
region:'south',
height:500,
loadMask: true,
el:'center',
title:'用户列表',
store: ds,
cm: colModel,
autoScroll: true,
bbar: new Ext.PagingToolbar({
pageSize: 20,
store: ds,
displayInfo: true,
displayMsg: '第{0} 到 {1} 条数据 共{2}条',
emptyMsg: "没有数据"
})
});
var viewport = new Ext.Viewport({
layout:'border',
items:[{
border:false,
region:'north',
contentEl:'north-div',
tbar:tb,
height:26
},
grid
]}
);
ds.load({params:{start:0, limit:20}});
});
action:
package part1.action;
import java.io.PrintWriter;
import java.util.List;
import java.util.Map;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
import org.apache.struts2.ServletActionContext;
import part1.model.Appuser;
import com.opensymphony.xwork2.ActionContext;
public class ListAction extends BaseAction {
String jsonString;
public String getJsonString() {
return jsonString;
}
public void setJsonString(String jsonString) {
this.jsonString = jsonString;
}
public String execute() throws Exception{
ActionContext ctx = ActionContext.getContext();
Map session = ActionContext.getContext().getSession();
HttpServletRequest request = (HttpServletRequest)ctx.get(ServletActionContext.HTTP_REQUEST);
HttpServletResponse response = (HttpServletResponse)ctx.get(ServletActionContext.HTTP_RESPONSE);
response.reset();
response.setCharacterEncoding("utf-8");
//PrintWriter pw = response.getWriter();
List appusers = null;
appusers = mgr.getAppusers();
JSONArray array = new JSONArray();
JSONObject json = new JSONObject();
if(appusers != null && appusers.size() > 0){
for(int i=0;i<appusers.size();i++){
JSONObject row = new JSONObject();
Appuser user_temp = (Appuser)appusers.get(i);
row.put("userId",user_temp.getUserId());
row.put("userName", user_temp.getUserName());
row.put("password",user_temp.getPassword());
row.put("email", user_temp.getEmail());
array.add(row);
}
json.put("successproperty", true);
json.put("totalProperty", appusers.size());
json.put("root", array);
this.jsonString = json.toString();
}
return "sucess";
}
}
问题补充：
{"successproperty":true,"totalProperty":1,"root":[{"userId":1,"userName":"sa","password":"1","email":"1@1.1"}]}
这个是System.out.println(jsonString);打出来的
我把response.getWriter().println(jsonString);加上了也是没数据，才开始研究ext没多久，谢谢回贴！
问题补充：
fields: [
{'userId'},{'userName'},{'password'},{'email'}
] 这样子加上报错- -++
问题补充：
各位看看啦！！~~
问题补充：
我在js里面加这么一句:
ds.on('loadexception',function(t,o,a,e){alert('ex = '+e+',this = '+t+',o = '+o+',a = '+a);});
其中e打出来是[Object Error]
不知道是什么原因？
问题补充：
目前页面上可以打出json的字符串{"root":[{"userId":1,"userName":"sa","password":"1","email":"1@1.1"}],"totalProperty":1,"successproperty":true}
但跳不到jsp里面了。。
问题补充：
我的意思是，现在页面只打出个json字符串，不显示表格什么其他的元素了
问题补充：
我的就是先访问List.action然后打算进入List.jsp显示action取出的数据呀
但打出的就是一堆数据串，页面出不来
问题补充：
试了把successproperty去掉，把JsonStore换成Ext.data.Store还是只打出字串。。
问题补充：
好像和region:"center"也没什么关系，现在的唯一问题是不出页面- -||
谢谢两位回贴！
问题补充：
我如果先要访问一个action去取数据，然后在跳到一个jsp页面显示数据，这么写对么？
问题补充：
请把你第一个item内容取得，再把grid的region设置为center，你的页面就可以出现。
--------这句话没懂- -||
问题补充：
是直接写
var viewport = new Ext.Viewport({
grid
]}
); 吗？
问题补充：
目前我的访问流程是：login.html->submit->LoginAction->success后返回login.html->再进入ListAction->list.jsp
这个要是用extjs看的话是不是有问题？
问题补充：
grid中region设置为center也是不显示页面，只有数据- -
{"root":[{"userId":1,"userName":"sa","password":"1","email":"1@1.1"},{"userId":2,"userName":"1","password":"1","email":"1"},{"userId":3,"userName":"2","password":"2","email":"2"},{"userId":4,"userName":"3","password":"3","email":"3"},{"userId":5,"userName":"4","password":"4","email":"4"},{"userId":6,"userName":"5","password":"5","email":"5"},{"userId":7,"userName":"6","password":"6","email":"6"},{"userId":8,"userName":"7","password":"7","email":"7"},{"userId":9,"userName":"8","password":"8","email":"8"},{"userId":10,"userName":"9","password":"9","email":"9"}],"totalProperty":10}
我去吃点东西，一会回来，非常感谢！
问题补充：
tb那段是需要在jsp里面加上
<div id="north-div"></div>
这一行~
现在问题就是如果我先访问list.action，然后return null;
就直接打出字符串，没进jsp- -
问题补充：
晕，有点乱了。。。我才接触extjs没多久
我的意思是，我要在数据库里取一个list,显示在jsp上，如果是struts或者是struts2的话就是先访问ListAction取数据，然后mapping转向到jsp,页面就出来了。
但Extjs也是如此吗？我有点晕了。。
问题补充：
我把js改了一个简单的
Ext.onReady(function(){
Ext.BLANK_IMAGE_URL = 'extjs/resources/images/default/s.gif';
Ext.QuickTips.init();
var sm = new Ext.grid.CheckboxSelectionModel();
var cm = new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(),
sm,
{header:'编号',dataIndex:'userId',sortable:true},
{header:'用户名',dataIndex:'userName'},
{header:'密码',dataIndex:'password'},
{header:'电子邮件',dataIndex:'email'}
]);
var ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'List.action'}),
reader: new Ext.data.JsonReader({
root: 'root',
totalProperty: 'totalProperty'
}, [
{name: 'userId',mapping:'userId',type:'int'},
{name: 'userName',mapping:'userName',type:'string'},
{name: 'password',mapping:'password',type:'string'},
{name: 'email',mapping:'email',type:'string'}
])
});
var grid = new Ext.grid.GridPanel({
el: 'center',
ds: ds,
sm: sm,
cm: cm,
width:700,
height:280,
bbar: new Ext.PagingToolbar({
pageSize: 10,
store: ds,
displayInfo: true,
displayMsg: '显示第 {0} 条到 {1} 条记录，一共 {2} 条',
emptyMsg: "没有记录"
})
});
grid.render();
ds.load({params:{start:0, limit:10}});
ds.load({callback:function(records,success,totalRecords){alert('records = '+records);}});
});
但是也不好用- -|不知道哪里有问题
问题补充：
问题好像解决了，我把ListAction查询数据的代码一起写到了LoginAction里，然后如果登录成功的话就window.location = 'List.jsp';终于出数据了！
谢谢两位！！非常感谢！！！
你建立一个JSP
[color=red]list.jsp[/color]
<%@ page language="java" pageEncoding="utf-8"%>
<%
out.println("{'root':[{'userId':1,'userName':'sa','password':'1','email':'1@1.1'},{'userId':2,'userName':'1','password':'1','email':'1'},{'userId':3,'userName':'2','password':'2','email':'2'},{'userId':4,'userName':'3','password':'3','email':'3'},{'userId':5,'userName':'4','password':'4','email':'4'},{'userId':6,'userName':'5','password':'5','email':'5'},{'userId':7,'userName':'6','password':'6','email':'6'},{'userId':8,'userName':'7','password':'7','email':'7'},{'userId':9,'userName':'8','password':'8','email':'8'},{'userId':10,'userName':'9','password':'9','email':'9'}],'totalProperty':10} ");
%>
把store里面的访问路径改一下啊数据就出来了
1：fields: [
{'userId'},{'userName'},{'password'},{'email'}
]
2：[color=red]response.getWriter().println(jsonString);[/color]这个貌似你没有写吧，不写是不能出数据的
3：最后可以不用return ，因为store.load是使用AJAX原理实现的，只需要产生回就可以了，不需要返回任何路径，返回个NULL也可以的
var store = new Ext.data.[color=red]Store/color,
reader: new Ext.data.JsonReader({ root: 'list',
totalProperty: 'totalCount',
fields:[{'userId'},{'userName'},{'password'},{'email'}]
}),
remoteSort: false
});
[color=red]response.getWriter().println(jsonString);这个貌似你没有写吧，不写是不能出数据的 [/color]
这个是必须要输出的
EXT是采用AJAX方法来取值的，没必要跳到别的JSP上了
单独访问ACTION输出的就是JSON格式的字符串，这个没问题，你现在还是显示不了数据吗？successproperty这个去掉，
var ds = new Ext.data.[color=red]JsonStore[/color]
把这个JsonStore换成Ext.data.Store
[code="java"]
var viewport = new Ext.Viewport({
layout:'border',
items:[{
border:false,
region:'north',
contentEl:'north-div',
tbar:tb,
height:26
},
grid
]}
);
[/code]
你的viewport没有region:"center",Viewport必须有一个组件的region为"center"。
楼主，你返回的jsonData是没有错误的，我的意思是你现在应该关注下你js 的写法，你觉得你js 的写法有问题。
你仔细对照下grid的例子，看看有什么问题
[code="java"]
var viewport = new Ext.Viewport({
layout:'border',
items:[{
border:false,
region:'north',
contentEl:'north-div',
tbar:tb,
height:26
},
grid
]}
);
[/code]
[code="java"]
{
border:false,
region:'north',
contentEl:'north-div',
tbar:tb,
height:26
},
[/code]
请把你第一个item内容取得，再把grid的region设置为center，你的页面就可以出现。
请把你第一个item内容取掉，再把grid的region设置为center，你的页面就可以出现。
不好意思打错字了
我如果先要访问一个action去取数据，然后在跳到一个jsp页面显示数据，这么写对么？
如果你用ext的话，因为是ajax框架，所以你从第一个页面发起取数据的请求，而你取得数据后跳到第二个页面，那么你的操作就是错误。也就是说你第一页面发起数据请求，最后数据直接通过XMLHTTPRequest管道回到你的请求页面中。
ajax不就存在跳转页面 的概念了，它是局部刷新页面，不要理解错误。
[code="java"]
是直接写
var viewport = new Ext.Viewport({
grid
]}
); 吗？
[/code]
是的，不过你的grid中region要设置为center
你试试这个
Ext.onReady(function(){
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget='side';
var ds = new Ext.data.Store({
proxy : new Ext.data.HttpProxy({url:'List.action'}),
reader: new Ext.data.JsonReader({
totalProperty: 'totalProperty',
root: 'root',
fields: [
'userId','userName','password','email'
]
})
});
//alert(ds.getCount()) ;
//alert(ds.getAt(0).get("userName")) ;
var colModel = new Ext.grid.ColumnModel([
{id:'title',header:'ID',width:50,sortable:true,dataIndex:'userId'},
{header:'用户名', width:100,sortable:true,dataIndex:'userName'},
{header:'密码明码',width:100,sortable:true,dataIndex:'password'},
{header:'电子邮件',width:100,sortable:true,dataIndex:'email'}
]);
var grid = new Ext.grid.GridPanel({
border:false,
// renderTo:'role_Role-GRID',
region:'center',
height:document.body.clientHeight,
loadMask: true,
title:'用户列表',
store: ds,
width:document.body.clientWidth,
cm: colModel,
autoScroll: true,
bbar: new Ext.PagingToolbar({
pageSize: 20,
store: ds,
displayInfo: true,
displayMsg: '第{0} 到 {1} 条数据 共{2}条',
emptyMsg: "没有数据"
})
});
//grid.render();
var viewport = new Ext.Viewport({
layout:'border',
items:[{
border:false,
region:'north',
contentEl:'role_Role-GRID',
tbar:[
{
text: '添加',
tooltip:'Add a new row',
iconCls:'add'
},{
text: '编辑',
tooltip:'edit a new row',
iconCls:'option'
},{
text: '删除',
tooltip:'delete a new row',
iconCls:'remove'
}
],
height:26
},
grid
]}
);
ds.load({params:{start:0, limit:20}});
[code="java"]var tb = new Ext.Toolbar("north-div");
tb.add({
text: '添加',
tooltip:'Add a new row',
iconCls:'add',
handler: newUser
},{
text: '编辑',
tooltip:'edit a new row',
iconCls:'option',
handler: editUser
},{
text: '删除',
tooltip:'delete a new row',
iconCls:'remove',
handler: delUser
}); [/code]
你把这段代码去掉，再看看，我刚刚再本地测试了，去掉这个grid就出现了
现在问题就是如果我先访问list.action，然后return null;
就直接打出字符串，没进jsp
如果你的后台向index.html成功返回数据，那么当你接收到这个数据的时候，再进行jsp跳转请求。
如下：
[code="java"]
ds.load({params:{start:0, limit:20},callback:function(o,options,success){
window.localtion = jsp;
}});
[/code]
恭喜你，终于搞定了。