Двойной щелчок в древовидной панели должен добавить в сетку панели Extjs

Question

Я новичок в extjs, может кто-нибудь, пожалуйста, помогите мне в этом.

Когда я дважды щелкаю элемент на панели дерева, он должен добавляться на панель сетки без каких-либо изменений в древовидной панели.

Answer 1

Вы можете разместить прослушиватель события itemdblclick на древовидной панели, чтобы получить данные из необработанного свойства элемента, которое было дважды щелкнуто. Затем, со ссылкой на хранилище базовой сетки, просто добавьте этот объект данных, используя метод storeRawData хранилища. Вот пример кода, основанный на примерах веб-сайта Sencha:

var store = Ext.create('Ext.data.TreeStore', {
    root: {
        expanded: true,
        children: [
            { text: "School Friends", expanded: true, children: [
                { text: "Mike", leaf: true, name: "Mike", email: "[e-mail]", phone: "345-2222"},
                { text: "Laura", leaf: true, name: "Laura", email: "[e-mail]", phone: "345-3333"}
            ] },
            { text: "Facebook Friend", expanded: true, children: [
                { text: "Steve", leaf: true, name: "Steve", email: "[e-mail]", phone: "345-2222"},
                { text: "Lisa", leaf: true, name: "Lisa", email: "[e-mail]", phone: "345-3333"}
            ] },
        ]
    }
});

Ext.create('Ext.tree.Panel', {
    title: 'All My Friends',
    width: 200,
    height: 150,
    store: store,
    rootVisible: false,
    renderTo: Ext.getBody(),
    listeners : {
            itemdblclick : function(tree, record, index){
                Ext.getStore('simpsonsStore').loadRawData([record.raw], true);
            }
    }
});

Ext.create('Ext.data.Store', {
    storeId:'simpsonsStore',
    fields:['name', 'email', 'phone'],
    data:{'items':[
        { 'name': 'Bart',  "email":"[e-mail]",  "phone":"555-222-1234" },
        { 'name': 'Homer', "email":"[e-mail]",  "phone":"555-222-1244"  },
        { 'name': 'Marge', "email":"[e-mail]", "phone":"555-222-1254"  }
    ]},
    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            root: 'items'
        }
    }
});

Ext.create('Ext.grid.Panel', {
    title: 'Best Friends',
    store: Ext.data.StoreManager.lookup('simpsonsStore'),
    columns: [
        { text: 'Name',  dataIndex: 'name' },
        { text: 'Email', dataIndex: 'email', flex: 1 },
        { text: 'Phone', dataIndex: 'phone' }
    ],
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
});