Extjs毕业设计：在做分页查询产品信息时，出现TypeError: this.ds is undefined？

来源：互联网发布：matlab数据导入origin 编辑：程序博客网时间：2024/06/11 15:51

分析：this.ds is undefined? 说明：ds--> datastore 说明是 store那出问题了。

我的productlist.js代码如下：

Ext.onReady(function(){
   Ext.QuickTips.init();//浮动信息提示,启动悬停提示
   Ext.BLANK_IMAGE_URL = "../../scripts/extjs/resources/images/default/s.gif";//替换图片文件地址为本地
   //获取数据源，该方法返回一个json格式的数据源，同一个域里边用HttpProxy ; 跨域用ScriptTagProxy
   var proxy = new Ext.data.HttpProxy({
       url : 'getAllProduct.action'

   });
   //定义reader，读取数据源用json方法（三种方法：1 读取json 用JsonReader;2.读取数组使用ArrayReader 3.读取XML用XmlReader ）
   var reader = new Ext.data.JsonReader({
       totalProperty:'totalCount',//从数据库中读取的总记录数
       root: 'jsonarray'
   },[
       {name: 'id'}, //读取处理的字段
       {name: 'name'},
       {name: 'ptype'},
       {name: 'batch'},
       {name: 'unit'},
       {name: 'price'},
       {name: 'memo'}
       ]);
   //构建Store,读取数据，Json格式
   var store = new Ext.data.Store({
       proxy : proxy,
       reader : reader
   });
    //加载
   store.load({params:{start:0, limit:10}});

    var sm = new Ext.grid.CheckboxSelectionModel();

    // create the Grid
    var grid = new Ext.grid.GridPanel({
       store:store,
        columns: [
            new Ext.grid.RowNumberer(),
            sm,
            {header: "ID", width: 75, sortable: true, dataIndex: 'id'},
            {header: "名称", width: 75, sortable: true, dataIndex: 'name'},
            {header: "型号", width: 75, sortable: true, dataIndex: 'ptype'},
            {header: "等级/批次", width: 75, sortable: true, dataIndex: 'batch'},
            {header: "单位", width: 85, sortable: true, dataIndex: 'unit'},
           {header: "单价", width: 85, sortable: true, dataIndex: 'price'},
           {header: "备注", width: 85, sortable: true, dataIndex: 'memo'}
        ],
        stripeRows: true,
//        autoExpandColumn: 'company',
        bodyStyle:'width:100%',
        height:425,
        loadMask:{msg:'数据加载中，请稍后...'},//出现loading图标
        frame:true,
        title:'当前位置>基础数据管理>产品查询>产品列表',
        plugins: new Ext.ux.PanelResizer({
            minHeight: 100
        }),
        //分页工具条
        bbar: new Ext.PagingToolbar({
            pageSize: 10,   //每页的记录数
            //store: store, //开始这个地方没有，所以报错ds is undefined? 注释掉注释就搞定了。
            displayInfo: true, //是否显示displayMsg 默认是不显示
           displayMsg:"<span style='font-sytle:italic;'>当前显示从{0}条到{1}条,共{2}条</span>",
           emptyMsg:"<span style='color:red;font-sytle:italic;'>没有数据</span>", //没有记录时显示的文本，
            plugins: new Ext.ux.ProgressBarPager()
        })
    });

    grid.render('grid-product');
    //

});

总结：

处理这store 没有显示的问题需要考虑下面几条：

1. Validate that the URL is accessible ,(验证你的URL是有效的，比如这里我的url：getAllProduct.action ，在服务器端打断点，能进入debug模式，说明这条我符合)
2. Make sure that data is really coming that from the URL.（确认你的数据真的从URL传递到前台来了，这里我通过 firefox 的响应能看到我传递过来的json格式的数据，符合）
3. Is your data in valid formate for extjs?（验证你的数据和extjs格式匹配，这里我对比po类中的字段，检查extjs中的字段，符合，说明是我extjs中的属性没添加，见红色注释部分）

如图：

0 0