2

我最近开发了一个关于显示类别/子类别的煎茶应用程序。它显示主要类别,但在单击任何类别时不显示子类别。

我的店是——

Ext.define('listdemo.store.Sections', {
extend : 'Ext.data.Store',

config : {
    autoLoad: true,
    model: 'listdemo.model.Sections',

    proxy:{
        type   : 'ajax',
        url:'http://localhost/catt.php',

        reader:{
                    type:'json',
                    rootProperty:'categories'       
                }

    }
}
});

型号代码是-----

Ext.define('listdemo.model.Sections', {
extend: 'Ext.data.Model',

config: {
    fields: ['categories_id', 'categories_name','subcategories'],


}
});

而观点是——

Ext.define('listdemo.view.Main',{
       extend: 'Ext.NestedList',
       xtype:'main',
       requires: [
            'Ext.TitleBar',
            'Ext.dataview.List',
            'Ext.data.Store',
            'Ext.dataview.NestedList'
        ],

       config:{
           title: 'Categories',
           //store:'Sections',
           items:[
           {
               xtype:'list',
               itemTpl:'{categories_name}',
               title:'Categories',
               store:'Sections',

            }
        ]
    }
});

我的php文件返回----

{"categories":[{"categories_id":"1","categories_name":"Hardware","subcategories":[{"categories_id":"4","categories_name":"显卡"},{"categories_id ":"5","categories_name":"Printers"},{"categories_id":"6","categories_name":"Monitors"},{"categories_id":"7","categories_name":"Speakers"} ,{"categories_id":"8","categories_name":"键盘"},{"categories_id":"9","categories_name":"鼠标"},{"categories_id":"16","categories_name": "内存"},{"categories_id":"17","categories_name":"CDROM 驱动器"}]},{"categories_id":"2","categories_name":"Software","subcategories":[{"categories_id":"18","categories_name":"模拟"},{"categories_id ":"19","categories_name":"Action"},{"categories_id":"20","categories_name":"策略"}]},{"categories_id":"3","categories_name":"DVD电影","子类别":[{"categories_id":"10","categories_name":"Action"},{"categories_id":"11","categories_name":"科幻小说"},{"categories_id": "12","categories_name":"喜剧"},{"categories_id":"13","categories_name":"卡通"},{"categories_id":"14","categories_name":"Thriller"},{"categories_id":"15","categories_name":"戏剧"}]}] }

我将如何在主要类别下显示子类别。

4

2 回答 2

0
  1. 为您的商店提供商店 ID

2.传递参数categories_name,选择父目录为categories_name的子类别成功:function(response){

searchresponse2 = Ext.JSON.decode(response.responseText);// 从服务器获取响应

//searchresponse2 是在数组 index[0] 中存储第一个结果的数组

搜索响应2=搜索响应2[0];

var categoriesid=searchresponse2.categories;//获取第一个值"categories_id":"1","categories_name":"Hardware"

         var categoriesname=searchresponse2.categories_name;

                del_categoriesid=[];//declaring array
                del_categoriesname=[];

           for(var i= 0;i<searchresponse2.length;i++)
                {
                    del_categoriesid[i]=searchresponse2[i].categories;
                    del_categoriesname[i]=searchresponse2[i].categories_name;
                }// looping through all values


                for(var j= 0;j < searchresponse2.length;j++)
                {

Ext.getStore('storeid').add({categories:del_categoriesid[j], categories_name:del_categoriesname[j]}); }//将结果的值添加到存储中

于 2014-07-24T20:43:46.030 回答
0

您需要更新模型定义以包含字段类型,并注册自定义数据类型以用于子类别。

首先在模型加载之前包含这个:

Ext.data.Types.ARRAY = {
    type: 'Array'
}; 

接下来更新您的模型,使其如下所示:

Ext.define('listdemo.model.Sections', {
    extend: 'Ext.data.Model',
    config: {
        fields: [{
            name: 'categories_id',
            type: 'int'
        },{ 
            name: 'categories_name',
            type: 'string'
        },{
            name: 'subcategories'
            type: Ext.data.Types.ARRAY
        }]
    }
});

现在,一旦您的商店加载,请通过 Web 控制台手动检查记录,以确保保存子类别数组。您将需要在列表中为 itemtap 添加一个侦听器,然后获取子类别,然后:
- 使用子类别数组手动重新加载原始商店。这应该会刷新列表,但是您将失去原始商店并且不会有任何卡片动画。
- 设置第二个列表/商店,该列表/商店将手动重新加载子类别,这将允许更改卡动画并保持原始商店以进行后退导航。

于 2012-12-05T05:57:33.980 回答