首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

!Ext4.0中treegrid怎么获得和处理Servlet传来的Json数据

2012-04-14 
求助!Ext4.0中treegrid如何获得和处理Servlet传来的Json数据问题是这样的。最近在做一个查询系统,记录中有

求助!Ext4.0中treegrid如何获得和处理Servlet传来的Json数据
问题是这样的。最近在做一个查询系统,记录中有父记录和子记录,于是找到了ext的treegrid插件,也是第一次使用。只是改了一下官网下载的案例,只改动了一些列。
打算将treegrid嵌入到<form></form>中,当进入到这个页面时,treegrid是空的,当用户查询时(通过ajax异步提交数据,该页面不跳转),后台将查询结果组织成Json字符串传递到前台,treegrid解析json显示。
现在遇到的主要问题是对treegrid加载数据的方式不理解,proxy的type是ajax,当一进入这个页面时就会加载treegrid.json,这是官方的实现。而小弟要实现的是第一次进入这个页面时不加载,只有当ajax成功返回以后treegrid才加载数据。现在后台数据已经组织好,将打印出的数据拷贝到现有的treegrid.json中能实现属性所示,如下图。现在对前台如何处理返回的json数据一知半解,望各位大虾指教。感激不尽!
如图所示

这是改了官网例子以后的treegrid.js

JScript code
    Ext.require([    'Ext.data.*',    'Ext.grid.*',    'Ext.tree.*']);Ext.onReady(function() {    //we want to setup a model and store instead of using dataUrl    Ext.define('strSiteName', {        extend: 'Ext.data.Model',        fields: [                       {name: 'strSiteName',     type: 'string'},            {name: 'flaSiteScore', type: 'double'},            {name: 'flaInfoDisclosureScore',     type: 'double'},            {name: 'flaOnlineServicesScore',     type: 'double'},            {name: 'flaPublicParticipationSore', type: 'double'},            {name: 'flaWebDesignScore', type: 'double'},            {name: 'flaDailyScore', type: 'double'}                                    ]    });            var store = Ext.create('Ext.data.TreeStore', {        model: 'strSiteName',        proxy: {            type: 'ajax',            //the store will get the content from the .json file            url: 'treegrid.json'        },        folderSort: true    });    //Ext.ux.tree.TreeGrid is no longer a Ux. You can simply use a tree.TreePanel    var tree = Ext.create('Ext.tree.Panel', {        title: 'Duration',        width: 800,        height: 300,        renderTo: Ext.getBody(),        collapsible: true,        useArrows: true,        rootVisible: false,        store: store,        multiSelect: true,        singleExpand: false,        //the 'columns' property is now 'headers'        columns: [{            xtype: 'treecolumn', //this is so we know which column will show the tree            text: '网站名称',            flex: 8,                        sortable: true,            dataIndex: 'strSiteName'        },{                        text: '总分',            flex: 5,            sortable: true,            dataIndex: 'flaSiteScore'        },{                        text: '公开',            flex: 5,            sortable: true,            dataIndex: 'flaInfoDisclosureScore'        },{                        text: '在线办事',            flex: 5,            sortable: true,            dataIndex: 'flaOnlineServicesScore'        },{                        text: '公众参与',            flex: 5,            sortable: true,            dataIndex: 'flaPublicParticipationSore'        },{                        text: '网站性能及设计',            flex: 5,            sortable: true,            dataIndex: 'flaWebDesignScore'        },{                        text: '日常保障',            flex: 5,            sortable: true,            dataIndex: 'flaDailyScore'        }    ]    });});



[解决办法]
tree中 试下:loadStore:false

或者

store中 试下:autoLoad:false

热点排行
Bad Request.