Question

我的Extjs网格组件有问题。如果查看附加的屏幕截图，您将看到两行JSON数据是正确的。

但是，正如你可以看到附加的屏幕截图，ExtJS网格组件只显示一行，这是一个奇怪的问题。我尝试了一切都没有成功:(

这是ExtJS代码：

客户部门的数据存储：

    var customersStore = new Ext.data.JsonStore({
    root: 'customers',
    baseParams: { action: 'customers'},
    proxy: new Ext.data.HttpProxy({
        url: '../invoice/grid-master-details.php',
        method: 'POST'
    }),
    fields: ['MetroNo', 'SpecVatNo', 'HomeStoreNo', 'CustShortName', 'StoreName', 'months',
    { name: 'invtotal', type: 'float' },
    { name: 'invcount', type: 'int' }],
    idProperty: 'MetroNo'
});

网格初始化参数：

    Ext.onReady(function() {
    Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

    function change(val) {
        if (val > 0) {
            return '<span style="color:green;">' + val + '</span>';
        } else if (val < 0) {
            return '<span style="color:red;">' + val + '</span>';
        }
        return val;
    }

    var customersGrid = new Ext.grid.GridPanel({
        title: 'Customer Informations',
        plugins: new Ext.ux.GridTotals(),
        renderTo: 'customers-div',
        store: customersStore,
        sm: new Ext.grid.RowSelectionModel({ singleSelect: true }),
        columns: [
            { id: 'vat-no',
                header: "Tax Number",
                width: 50,
                dataIndex: 'SpecVatNo',
                sortable: false,
                hidden: true

            },
            { id: 'store-name',
                header: 'Store Name',
                width: 70,
                dataIndex: 'StoreName',
                sortable: true
            },
            { id: 'cust-name',
                header: 'Customer Title',
                width: 130,
                dataIndex: 'CustShortName',
                sortable: true,
                totalsText: 'TOTAL'
            },
            { id: 'invoice-count',
                header: "Invoice Address",
                width: 40,
                dataIndex: 'invcount',
                align: 'right',
                sortable: false,
                summaryType: 'sum'
            },
            { id: 'invoice-total',
                header: "Invoice Total",
                width: 60,
                dataIndex: 'invtotal',
                align: 'right',
                sortable: false,
                renderer: Ext.util.Format.CurrencyFactory(true, 2, ",", ".", "TL", true),
                summaryType : 'sum',
                roundToPlaces: 3
            },
            {
                id: 'selected-date',
                header: "Period",
                width: 20,
                dataIndex: 'months',
                sortable: false,
                hidden: true
            }               
        ],
        autoExpandColumn: 'cust-name',
        width: 700,
        height: 240,
        loadMask: {msg:'Loading customer infos ...'},
        stripeRows: true,
        columnLines:true,
        stateful: true,
        stateId: 'customerGrid',
        viewConfig: {
            forceFit: true
        },
        tbar: new Ext.Toolbar({
            items: [{   xtype: 'tbtext', text: 'Period' }, 
                    {   xtype: 'tbspacer', width: 10},
                    {   xtype: 'combo',
                            store: datesStore,
                            id: 'monthid',
                            displayField: 'months',
                            valueField: 'dateid',
                            editable: false,
                            mode: 'remote',
                            forceSelection: true,
                            triggerAction: 'all',
                            emptyText: 'Select Period...',
                            selectOnFocus: true
                    }, 
                    {   xtype: 'tbspacer', width: 15},
                    {   xtype: 'tbseparator'},
                    {   xtype: 'tbspacer', width: 10},
                    {   xtype: 'tbtext', text: 'Tax Number'},
                    {   xtype: 'tbspacer', width: 10},
                    {   xtype: 'textfield', id: 'vatnoid'},
                    {   xtype: 'tbspacer', width: 10},
                    {   xtype: 'button', 
                            text: ' Show ', 
                            iconCls: 'quicksearch',
                            handler: function() {
                                var mid = Ext.getCmp('monthid').getValue();
                                var vid = Ext.getCmp('vatnoid').getValue();
                                customersStore.load({
                                    params: {'months': mid, 'vatno': vid}
                                });
                            }
                    }
                    ]
        })
    });

Answer 1

基础idProperty类的Model被指定为MetroNo，这对于JSON响应中返回的每条记录都不是唯一的。

将idProperty更改为每条记录唯一的字段。

EXTJS网格数据问题

1 个答案: