关闭

jqgrid前台数据显示问题原因和解决方案

标签: 解决方案jsonjqgridintellij idea
211人阅读 评论(0) 收藏 举报
分类:

这个问题很是坑的,找了很多网上的办法都不行,也是郁闷了一天,都没和女朋友说上话,唉,解决这个问题的你一定要记住以下几点:

1.传回前台的数据一定是JSon类型的数据,而不是后台json数据转化后的字符串

2.传回前台的json数据的格式一定要正确,你可以去在线的json数据验证,去验证一下你传回前台的数据是否符合json的格式


我之间遇到的问题和解决过程:

问题一:数据传到前端是“{result:{"totalpages":2,"currpage":1,"totalrecords":19,"invdata":[{"adminId":15,"adminName":"macal35","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":14,"adminName":"macal","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":26,"adminName":"macal10","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":16,"adminName":"macal1","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":19,"adminName":"macal2","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":20,"adminName":"macal3","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":21,"adminName":"macal4","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":22,"adminName":"macal7","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":32,"adminName":"55555","adminPassWord":"ces","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":31,"adminName":"0007","adminPassWord":"0007","lastLoginDate":null,"lastLoginIp":"","rolename":""}]}}”,这时候前端没法解析,因为有result:{}

原因:在Struts.xml配置的是:

<action name="getAdminlistAction" class="org.pedus.action.AdminManegeAction" method="AdminList">
    <result type="json">
    </result>
</action>
然后改成:
<action name="getAdminlistAction" class="org.pedus.action.AdminManegeAction" method="AdminList">
    <result type="json">
        <param name="root">result</param><!-- 返回的结果中不是result:{...}的形式,而是{...}-->
    </result>
</action>

然后前端就是显示:“{"totalpages":2,"currpage":1,"totalrecords":19,"invdata":[{"adminId":15,"adminName":"macal35","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":14,"adminName":"macal","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":26,"adminName":"macal10","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":16,"adminName":"macal1","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":19,"adminName":"macal2","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":20,"adminName":"macal3","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":21,"adminName":"macal4","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":22,"adminName":"macal7","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":32,"adminName":"55555","adminPassWord":"ces","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":31,"adminName":"0007","adminPassWord":"0007","lastLoginDate":null,"lastLoginIp":"","rolename":""}]}”,这样倒是没有result:{}了,但是还是不能显示

原因:我后台在返回数据的时候,将json数据转化成了字符串,前端就出现了  “{}”,注意两端有 引号,另外每个引号前还有反斜杠转义字符,

然后我就直接让他返回,json类型数据,而不是返回转化后的字符串,然后出现Exception occurred during processing request: java.lang.reflect.InvocationTargetException这个错误,这个错误可能是Struts要返回的是转化成字符串的json数据吧,但我返回的是json类型的数据,导致Struts不理解。

唉,那就换方法吧:这次我用  getResponse().getWriter().print(); 将json类型的数据返回到客户端,但是又出现了前端显示数据不完整的现象,在网上查了查,才知道要将后台那个函数的 return SUCCESS;改成 return null;果不其然数据都显示出来了,另外我看了一下返回到前端的数据:{"totalpages":2,"currpage":1,"totalrecords":19,"invdata":[{"adminId":15,"adminName":"macal35","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":14,"adminName":"macal","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":26,"adminName":"macal10","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":16,"adminName":"macal1","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":19,"adminName":"macal2","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":20,"adminName":"macal3","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":21,"adminName":"macal4","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":22,"adminName":"macal7","adminPassWord":"123456","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":32,"adminName":"55555","adminPassWord":"ces","lastLoginDate":null,"lastLoginIp":"","rolename":""},{"adminId":31,"adminName":"0007","adminPassWord":"0007","lastLoginDate":null,"lastLoginIp":"","rolename":""}]},这次你会发现两边的双引号没了,这就是实实在在的json数据


总结:前端解析的一定是json类型的数据,不是json转化后的字符串。


下面我给出前后台的部分代码:

前台:

jQuery(function($) {
      var grid_selector = "#grid-table";
      var pager_selector = "#grid-pager";

      jQuery(grid_selector).jqGrid({

         url:"kkAction",
         datatype:"json",
         mtype:"POST",
         height: 250,
         colNames:[' ', '用户ID','用户名','密码', '角色', '最近一次登录IP', '最近一次登录时间'],
         colModel:[
            {name:'myac',index:'', width:80, fixed:true, sortable:false, resize:false,
               formatter:'actions',
               formatoptions:{
                  keys:true,

                  delOptions:{recreateForm: true, beforeShowForm:beforeDeleteCallback,onclickSubmit:userdeled},
                  editformbutton:true, editOptions:{recreateForm: true, beforeShowForm:beforeEditCallback,afterSubmit:useredited}
               }
            },
            {name:'adminId',index:'adminId', width:60, sorttype:"int", editable: false},
            {name:'adminName',index:'adminName',width:90, editable:true, editoptions:{size:"20",maxlength:"30"}},
            {name:'adminPassWord',index:'adminPassWord', width:150,editable: true,editoptions:{size:"20",maxlength:"30"}},
            {name:'rolename',index:'rolename', width:150,editable: false,editoptions:{size:"20",maxlength:"30"}},
            {name:'lastLoginIP',index:'lastLoginIP', width:150,editable: false,editoptions:{size:"20",maxlength:"30"}},
            {name:'lastLoginDate',index:'lastLoginDate', width:150,editable: false, sorttype:"date",unformat: pickDate}
         ],
         jsonReader:{
            root:"invdata",
            page: "currpage",
            total: "totalpages",
            records: "totalrecords",
            repeatitems: false
         },
         viewrecords : true,
         rowNum:10,
         rowList:[10,20,30],
         pager : pager_selector,
         altRows: true,
         //toppager: true,

         multiselect: true,
         //multikey: "ctrlKey",
         multiboxonly: true,

         loadComplete : function(data) {
//          var grid_data = eval('('+data.result+')');
//          //alert("请求数据"+grid_data.currpage);
//          jQuery("#grid-table")[0].addJSONData(grid_data.invdata);
//          //jQuery("#grid-table").jqGrid({data:grid_data.invdata});
               var table = this;
            setTimeout(function(){
               styleCheckbox(table);

               updateActionIcons(table);
               updatePagerIcons(table);
               enableTooltips(table);
            }, 0);
         },
         loadError:function(xhr,status,error){
            alert("请求数据"+xhr.readyState+" "+status+" "+error);
         },

         editurl:"dummy.html",//nothing is saved
         caption: "jqGrid with inline editing",


         autowidth: true

      });

后台:

public String AdminList() throws Exception{
    List<Admin> ul = adminService.findAll();

    getResponse().getWriter().print(Pagination(ul, page, rows));//Pagination(ul, page, rows)返回JSONObject类型


    return null;
}




0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:5308次
    • 积分:161
    • 等级:
    • 排名:千里之外
    • 原创:11篇
    • 转载:1篇
    • 译文:0篇
    • 评论:1条
    文章分类
    最新评论