Sencha Touch 1.1 嵌套列表关联答案

【问题标题】：Sencha Touch 1.1 nested list associationsSencha Touch 1.1 嵌套列表关联
【发布时间】：2012-04-02 18:22:34
【问题描述】：

我有以下问题，我无法从子列表中获取数据，我做错了吗？哟 estoy usando sencha y genrando el archivo a txt en formato json 谢谢你的回复。

我的代码：

//文件 lstCabDet.txt

{"root":[
    {
    "NumeroPedido":"0000000001",
    "CodigoCliente":"100000",
    "NombreCliente":"hskjdnd",
    "NIF":"43065236",
        "Detalle":[{
        "DocumentoVenta":"0000000001",
        "Posicion":"000010",
        "CodigoMaterial":"000000000010000002",
        "Material":"Prueba material 1"}]},
    {
    "NumeroPedido":"0000000002",
    "CodigoCliente":"100000",
    "NombreCliente":"hskdsnb",
    "NIF":"43065236",
        "Detalle":[{
        "DocumentoVenta":"0000000002",
        "Posicion":"000010",
        "CodigoMaterial":"000000000010000002",
        "Material":"Prueba material 1"}]
    }]}

//Model
Ext.regModel('listaDocumentosModel', {
    fields: [
        {name: 'NumeroPedido', type: 'string'},
        {name: 'CodigoCliente',  type: 'string'},
        {name: 'NombreCliente',  type: 'string'},
        {name: 'NIF',  type: 'string'}
    ],
    associations:[
        {type: 'hasMany',
         model: 'listaDocumentoDetalleModel', name: 'listaDocumentoDetalleModel'}
    ]
});

Ext.regModel('listaDocumentoDetalleModel',
    {
    fields:[
        {name: 'DocumentoVenta',  type: 'string'},
        {name: 'Posicion',  type: 'string'},
        {name: 'CodigoMaterial', type: 'string'},
        {name: 'Material', type: 'string'}
    ],
    associations:[
        {type: 'belongsTo', model: 'listaDocumentosModel'}
    ]
});

//Store
var listaDocumentosStore = new Ext.data.Store (
{
    autoLoad: true,
    model: 'listaDocumentosModel',
    proxy:
    {
        id: 'listaDoc',
        type: 'rest',
        url: 'data/lstCabDet.txt',
        reader:
        {
            type: 'json',
            root : 'root'
        }
    }
});

//View Detail
var disDetDoc =
    '<div>'+
        '<div>'+
            '<div>{NumeroPedido}</div>'+
            '<div>{Posicion}</div>'+
            '<div>{CodigoMaterial}</div>'+
            '<div>{Material}</div>'
        '</div>'+
    '</div>';

detalleDocumento = Ext.extend(Ext.Panel, 
{
    layout: 'card',
    initComponent: function() 
    {
        this.dockedItems = [
        {
            xtype: 'toolbar',
            dock: 'top',
            title: 'Detalle documento',
            items: [
            {
                ui: 'back',
                text: 'Volver',
                scope: this,
                handler: function()
                {
                    this.ownerCt.setActiveItem(this.prevCard, 
                    {
                        type: 'slide',
                        reverse: true,
                        scope: this,
                        after: function()
                        {
                            this.destroy();
                        }
                    });
                }
            }]
        }];

        this.detalleDocPanel = new Ext.Panel(
        {
            layout: 'fit',

            items: [
            {
                scroll: 'vertical',
                data: this.record.data,
                tpl: disDetDoc          
            }]
        });

        this.items = this.detalleDocPanel;

        detalleDocumento.superclass.initComponent.call(this);
    }
});

Ext.reg('detalleDocumento', detalleDocumento);

//View Master
var listDoc =
    '<div class="materialItem">'+
        '<div class="list-codigo">'+
            '{NumeroPedido}'+
            '{CodigoCliente}'+
            '{NIF}'+
            '{NombreCliente}'+
        '</div>'
    '</div>';

var lblRef = [{
    xtype: 'fieldset',
    defaults: 
        {
            labelAlign: 'left',
            labelWidth: '30%'
        },
    items: [
    {
        xtype: 'textfield',
        label: 'Referencia',
        useClearIcon: true
    }]
}];

var buttonVolver = [{
    ui: 'back',
    text: 'Volver',
    handler: function()
        {
            window.open("consultaDoc.html","_self");
        }
    },
    {
        xtype: 'spacer'
    }
]

var dockedItems = [{
    xtype: 'toolbar',
    title: 'Lista de documentos',
    dock: 'top',
    ui: 'dark',
    items: buttonVolver
}]



listaDocumentoView = Ext.extend(Ext.Panel, 
{
    fullscreen: true,
    layout: 'card',     
    initComponent: function() 
    {
        this.lDoc = new Ext.List({
            id: 'listaDoc',
                grouped: false,
                itemTpl: listDoc,
                loadingText: false,
                store: listaDocumentosStore 
        });

        this.lDoc.on('selectionchange', this.onSelect, this);

        this.listaDocumentosPanel = new Ext.Panel(
        {   
            layout: 'fit',
            dockedItems: dockedItems,
            items: this.lDoc,
            listeners: 
            {
                activate: 
                { 
                    fn: function()
                    {
                        this.lDoc.getSelectionModel().deselectAll();
                        Ext.repaint();
                    }, 
                    scope: this 
                }
            }
        });

        this.items = this.listaDocumentosPanel;

        listaDocumentoView.superclass.initComponent.call(this);
    },

    onSelect: function(selectionmodel, records)
    {
        if (records[0] !== undefined) 
        {
           var detalleDocCard = new detalleDocumento(
           {
               prevCard: this.listaDocumentosPanel,
               record: records[0]
           });

           this.setActiveItem(detalleDocCard, 'slide');
        }
    }
});

Ext.reg('listaDocumentoView', listaDocumentoView);

【问题讨论】：

标签： json extjs nested-lists

【解决方案1】：

我正在处理同样的问题。也许这可以帮助您更接近解决方案：

在Accessing nested objects in JSON feed - Sencha Touch 回复：

Ext.regModel('MODEL', {
    fields: [{name:'position', mapping:'NIF.postion'}]

});

【讨论】：

【解决方案2】：

将您的模型更改为

Ext.regModel('listaDocumentosModel', {
fields: [
    {name: 'NumeroPedido', type: 'string'},
    {name: 'CodigoCliente',  type: 'string'},
    {name: 'NombreCliente',  type: 'string'},
    {name: 'NIF',  type: 'string'}
],
hasMany:[
    { model: 'listaDocumentoDetalleModel', name: 'listaDocumentoDetalleModel', , associationKey: 'listaDocumentoDetalleModel'}
]});

并从子模型中删除此行

associations:[
    {type: 'belongsTo', model: 'listaDocumentosModel'}
]

这个修改解决了我同样的问题，希望对你有帮助

【讨论】：