我在 ExtJS 中有一个视图,其中包含一个网格,用户可以在其中选择一个条目以及一些包含当前所选行详细信息的面板。每次选择另一行时,都会重新加载视图,这会导致网格失去键盘导航的输入焦点。
如何重新加载网格存储数据并使输入焦点保持在网格上?我的模型定义了idProperty
,因此选择了正确的行,但列选择和输入焦点丢失了。我正在使用 ExtJS v7.3.0.55 和 Classic Triton 主题。
例子
使用 JSON Store Sencha Fiddle 和数据模型和一些网格事件监听器扩展现有网格中的代码以重现该问题:
Ext.application({
name: 'Fiddle',
launch: function () {
// My data model with custom ID field
Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{name: 'name', type: 'string'},
{name: 'email', type: 'string'},
{name: 'phone', type: 'string'},
],
idProperty: 'email',
});
Ext.create('Ext.data.Store', {
storeId: 'simpsonsStore',
model: 'User',
proxy: {
type: 'ajax',
// Loading data from ./simpsons.json in the fiddle ./Data folder.
url: 'simpsons.json',
reader: {
type: 'json',
rootProperty: 'items'
}
}
});
Ext.create('Ext.grid.Panel', {
renderTo: Ext.getBody(),
height: 300,
width: "100%",
title: 'Simpsons',
store: 'simpsonsStore',
autoLoad: true,
columns: [{
text: 'Name',
dataIndex: 'name'
}, {
text: 'Email',
dataIndex: 'email',
flex: 1
}, {
text: 'Phone',
dataIndex: 'phone'
}],
摇曳的蔷薇
相关分类