yxskkk
2009-03-11 17:52
浏览 262

请大家帮忙看看我的json数据和struts2后台交互的问题

搞了很久,就是不出数据,快崩溃了,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';终于出数据了!
谢谢两位!!非常感谢!!!

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

16条回答 默认 最新

  • 马勒格彼得 2009-03-17 11:35
    已采纳

    你建立一个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里面的访问路径改一下啊数据就出来了

    已采纳该答案
    打赏 评论
  • 马勒格彼得 2009-03-12 09:32

    1:fields: [
    {'userId'},{'userName'},{'password'},{'email'}
    ]
    2:[color=red]response.getWriter().println(jsonString);[/color]这个貌似你没有写吧,不写是不能出数据的
    3:最后可以不用return ,因为store.load是使用AJAX原理实现的,只需要产生回就可以了,不需要返回任何路径,返回个NULL也可以的

    打赏 评论
  • 马勒格彼得 2009-03-12 10:59

    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]
    这个是必须要输出的

    打赏 评论
  • 马勒格彼得 2009-03-16 17:20

    EXT是采用AJAX方法来取值的,没必要跳到别的JSP上了

    打赏 评论
  • 马勒格彼得 2009-03-17 09:34

    单独访问ACTION输出的就是JSON格式的字符串,这个没问题,你现在还是显示不了数据吗?successproperty这个去掉,
    var ds = new Ext.data.[color=red]JsonStore[/color]
    把这个JsonStore换成Ext.data.Store

    打赏 评论
  • weixin_42312248 2009-03-17 10:56

    [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"。

    打赏 评论
  • weixin_42312248 2009-03-17 11:09

    楼主,你返回的jsonData是没有错误的,我的意思是你现在应该关注下你js 的写法,你觉得你js 的写法有问题。

    打赏 评论
  • 马勒格彼得 2009-03-17 11:09

    你仔细对照下grid的例子,看看有什么问题

    打赏 评论
  • weixin_42312248 2009-03-17 11:10

    [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,你的页面就可以出现。

    打赏 评论
  • weixin_42312248 2009-03-17 11:13

    请把你第一个item内容取掉,再把grid的region设置为center,你的页面就可以出现。
    不好意思打错字了

    打赏 评论
  • weixin_42312248 2009-03-17 11:17

    我如果先要访问一个action去取数据,然后在跳到一个jsp页面显示数据,这么写对么?
    如果你用ext的话,因为是ajax框架,所以你从第一个页面发起取数据的请求,而你取得数据后跳到第二个页面,那么你的操作就是错误。也就是说你第一页面发起数据请求,最后数据直接通过XMLHTTPRequest管道回到你的请求页面中。
    ajax不就存在跳转页面 的概念了,它是局部刷新页面,不要理解错误。

    打赏 评论
  • weixin_42312248 2009-03-17 11:18

    [code="java"]
    是直接写
    var viewport = new Ext.Viewport({
    grid
    ]}
    ); 吗?
    [/code]
    是的,不过你的grid中region要设置为center

    打赏 评论
  • 马勒格彼得 2009-03-17 11:26

    你试试这个

    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}}); 
    
    打赏 评论
  • weixin_42312248 2009-03-17 11:26

    [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就出现了

    打赏 评论
  • weixin_42312248 2009-03-17 11:40

    现在问题就是如果我先访问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]

    打赏 评论
  • weixin_42312248 2009-03-17 13:48

    恭喜你,终于搞定了。

    打赏 评论

相关推荐 更多相似问题