Question

我正在尝试将GridPanle添加到窗口中。为此，我创建了一个模型，存储然后创建了一个面板，然后将该面板添加到窗口中。

面对Panel列标题的问题。

以下是我正在使用的代码。

function(orderModel, ex112ServiceResponse) {
    var tablePopup = null;
    var gridPanel = null;
    var gridData = [];
    var gridStore = null;

    // Creation of data model
    Ext.define('StudentDataModel', {
        extend: 'Ext.data.Model',
        fields: [{
                name: 'reasonCode',
                mapping: 'reasonCode'
            },
            {
                name: 'reasonCodeDescription',
                mapping: 'reasonCodeDescription'
            },
            {
                name: 'refField1',
                mapping: 'refField1'
            },
            {
                name: 'orderID',
                mapping: 'orderID'
            },
            {
                name: 'orderLineID',
                mapping: 'orderLineID'
            }
        ]
    });

    // Store data

    //debugger;
    debugger;
    for (var index = 0; index < ex112ServiceResponse.objectReasonCode.length; index++) {
        gridData.push(ex112ServiceResponse.objectReasonCode[index]);
    }

    gridStore = Ext.create('Ext.data.Store', {
        model: 'StudentDataModel',
        data: gridData
    });

    gridPanel = Ext.create('Ext.grid.Panel', {
        id: 'gridId',
        layout: 'fit'
        store: gridStore,
        stripeRows: true,
        width: 800,
        enableColumnMove: true,
        enableColumnResize: true,
        autoDestroy: true,

        columns: [{
                header: "SKU/Item Number",
                dataIndex: 'refField1',
                id: 'refField1',
                //flex: .5,
                sortable: true,
                hideable: true
            }, {
                header: "Reason Code",
                dataIndex: 'reasonCode',
                id: 'reasonCode',
                //flex: .5, // property defines the amount of space this column is going to take in the grid container with respect to all. 
                sortable: true, // property to sort grid column data. 
                hideable: true // property which allows column to be hidden run time on user request.
            }, {
                header: "Description",
                dataIndex: 'reasonCodeDescription',
                id: 'reasonCodeDescription',
                //flex: 1,
                sortable: true,
                hideable: false // this column will not be available to be hidden.
            },
            {
                header: "DO :: DO Line",
                dataIndex: 'orderLineID',
                id: 'doDoLine',
                //flex: .5,
                sortable: true,
                renderer: function(value, metadata, record, rowIndex, colIndex, store) {
                    debugger;
                    var do_DOLine = record.raw.orderID + " :: " + record.raw.orderLineID;
                    return do_DOLine;

                }
            }
        ]
    });

    tablePopup = new Ext.Window({
        title: 'Cancellation Reason Codes',
        id: 'crcWin'
        width: 800,
        closeAction: 'close',
        plain: true,
        autoDestroy: true,

        items: [gridPanel]
    });

    tablePopup.show();
    //Table Creation End            
}

问题是代码第一次创建弹出窗口。弹出看起来不错。但是当我关闭弹出窗口并在第二次点击按钮时创建弹出窗口有问题。列名已更改。

Popup1：

Popup2：

我们非常感谢您的帮助。

Answer 1

问题是您已向{ext} West提供了id，并且window内部已使用了配置

component

单击关闭标题工具时要采用的//There is no close action in docs closeAction: 'close'//Defaults to: 'destroy'：

销毁：从DOM和destroy它以及所有后代组件中删除窗口。该窗口无法通过show方法重新显示。
隐藏：hide窗口，方法是设置隐藏的可见性并应用负偏移量。该窗口可通过show方法重新显示。

注意：此行为已更改！设置确实会影响将调用相应closeAction。

的close方法

您可以使用itemId。

，而不是使用closeAction

在 FIDDLE 中，我使用您的代码创建了一个演示。我希望这能够帮助/指导你。

CODE SNIPPET

id

GridPanel列名称自动更改

1 个答案: