ExtJs:Ext.grid.Panel:网格自动刷新并变为空白

时间:2013-05-08 09:08:15

标签: extjs extjs4

我正在使用网格在modal窗口上显示数据。 它有两列,1。标签2. TextField

我面临的问题是,每当我在文本字段中输入任何内容并从该文本字段中失去焦点时(通过按TAB或单击其他位置),网格会自行清除,我会得到一个空格!

我知道这与与网格关联的商店的autoSync属性有关。 所以我把它设置为假autoSync: false。 执行此操作后,数据将保留并正常工作。

但是当我关闭这个模态窗口并用相同的商店数据重新打开它时,我得到一个空白的屏幕!

以下是我的代码:

模型

Ext.define('Ext.ux.window.visualsqlquerybuilder.SQLAttributeValueModel', {
extend: 'Ext.data.Model',
fields: [
    {
        name: 'attribute',
        type: 'string'
    },
    {   name: 'attributeValue',
        type: 'string'
    }
]
});

商品

var attrValueStore = Ext.create('Ext.data.ArrayStore', {
   autoSync: true, //tried setting it to false but got error as mentioned above
   model: 'Ext.ux.window.visualsqlquerybuilder.SQLAttributeValueModel'
});

GRID

Ext.define('Ext.ux.window.visualsqlquerybuilder.SQLAttributeValueGrid', {
autoRender: true,
extend: 'Ext.grid.Panel',
alias: ['widget.attributevaluegrid'],
id: 'SQLAttributeValueGrid',
store: attrValueStore,
columnLines: true,
plugins: [Ext.create('Ext.grid.plugin.CellEditing', {
    clicksToEdit: 1
})],
columns: [        
    {                        /*Expression */
        xtype: 'gridcolumn',
        text: 'Attribute',
        sortable: false,
        menuDisabled: true,
        flex: 0.225,
        dataIndex: 'attribute'
    },
    {                           /*Attribute Values*/
        xtype: 'gridcolumn',
        editor: 'textfield',
        text: 'Values',
        flex: 0.225,
        dataIndex: 'attributeValue'
    }
],
initComponent: function () {
    this.callParent(arguments);
}
});

MODAL WINDOW

var attributeValueForm = Ext.create('Ext.window.Window', {
  title:'Missing Attribute Values',
  id: 'attributeValueForm',
  height:500,
  width:400,
  modal:true,
  renderTo: Ext.getBody(),
  closeAction: 'hide',
  items:[
   {
    xtype: 'attributevaluegrid',
    border: false,
    //height: 80,
    region: 'center',
    split: true
   }
  ],
  buttons: [
  {
    id: 'OKBtn',
    itemId: 'OKBtn',
    text: 'OK',
    handler: function () {
        Ext.getCmp('attributeValueForm').close();
    }
  },
  {
    text: 'Cancel',
    handler: function () {
        Ext.getCmp('attributeValueForm').close();
    }
   }
]
});

请帮忙。这让我发疯了!

2 个答案:

答案 0 :(得分:0)

如果您可以提供有关如何创建Window本身的详细信息,将会很有帮助,因为它可能是问题的一部分。

这可能是因为您正在隐藏窗口而不是关闭窗口,然后在重新打开时创建新实例。这将导致您的DOM有两个Windows实例,并且可能无法在第二个实例中正确同步数据。

关于如何创建实际窗口的更多细节将有助于阐明是否是这种情况。

答案 1 :(得分:0)

写完这篇文章后,我可能想要自己入狱。

真正的问题是我为不同的模态窗口创建了一个类似的网格,因为我复制了我错过的更改新网格ID的代码。

两个网格都具有相同的ID。

现在改了,现在工作正常。

感谢您的帮助!