EXT JS: Как загрузить выбранную строку сетки в окно?

Question

Форма Пользователь

Ext.define('Patients.view.Form',{ 
    extend: 'Ext.form.Panel', 
    xtype: 'patients_form', 
    title: 'Patient Info', 

    defaultType: 'textfield', 
    items: [{ 
     fieldLabel:'Name', 
     name: 'name', 
     allowBlank: false, 
    },{ 
     fieldLabel: 'Age', 
     name: 'age', 
     allowBlank: false 
    },{ 
     fieldLabel: 'Phone', 
     name: 'phnumber', 
     allowBlank: 'false' 
    }], 

    dockedItems: [{ 
     xtype:'toolbar', 
     dock: 'bottom', 
     items:[{ 
      iconCls: 'icon-user-add', 
      text: 'Add', 
      scope: this, 
      itemId: 'addButton' 

     },{ 
      iconCls: 'icon-reset', 
      itemId:'resetButton', 
      text: 'Reset', 
      scope: this 

     },{ 
      iconCls: 'icon-save', 
      itemId: 'savebutton', 
      text: 'Save', 
      disabled: true, 
      scope: this 

     }] 
    }] 

}); 

Это моя сетка, которая отображает пользовательский ввод. В строке дважды щелкните окно запуска, но оно пустое. Как отобразить информацию из выбранной строки в сетке в окне?

Ext.define('Patients.view.Grid',{ 
    extend: 'Ext.grid.Panel', 
    store:'PatientsInfo', 
    xtype: 'patients_grid', 
    selType: 'rowmodel', 

    listeners:{ 
     itemdblclick: function(record){ 
      var win = Ext.create("Ext.Window",{ 
       title: 'Patients Window', 
       height: 160, 
       width: 160, 

      }) 
      win.show(); 

     } 
    }, 

    columns: [{ 

     text: 'Name', 
     sortable: true, 
     resizable: false, 
     draggable: false, 
     hideable: false, 
     dataIndex: 'name' 
    },{ 
     text: 'Age', 
     sortable: true, 
     resizable: false, 
     draggable: false, 
     hideable: false, 
     dataIndex: 'age' 
    },{ 
     text: 'Phone Number', 
     sortable: false, 
     resizable: false, 
     draggable: false, 
     hideable: false, 
     dataIndex: 'phnumber' 
    }] 
}); 

Заранее благодарен!

Answer 1

вам нужно добавить реф в окно объектов

items: [{ 
     fieldLabel:'Name', 
     name: 'name', 
     allowBlank: false, 
     ref : '../name' 
    },{ 
     fieldLabel: 'Age', 
     name: 'age', 
     allowBlank: false, 
     ref : '../age' 
    },{ 
     fieldLabel: 'Phone', 
     name: 'phnumber', 
     allowBlank: 'false', 
     ref : '../phnumber' 
    }], 

и установить данные им, когда вы показываете окно.

itemdblclick: function(record){ 
      var win = Ext.create("Ext.Window",{ 
       title: 'Patients Window', 
       height: 160, 
       width: 160, 

      }) 
      win.name = record.get('name'); 
      win.age = record.get('age'); 
      win.prohne = record.get('phone'); 
      win.show(); 

     } 

Answer 2

Добавить формы свойства сетки в качестве эталона для образования, а также ShowForm() функции, когда пользователь нажимает кнопку Добавить или DblClick на сетке подряд, вы назовите его с идентификатором выбранных строка или нуль (при нажатии кнопки). ShowForm() проверяет формы ссылки, если это нуль, создать экземпляр формы и вызвать this.form.loadFormData (идентификатор)

Ext.define('Patients.view.Grid',{ 
    extend: 'Ext.grid.Panel', 
    store:'PatientsInfo', 
    xtype: 'patients_grid', 
    selType: 'rowmodel', 

    listeners:{ 
     itemdblclick: function(record){ 
      var win = Ext.create("Ext.Window",{ 
       title: 'Patients Window', 
       height: 160, 
       width: 160, 

      }) 
      win.show(); 

     } 
    }, 

form:null, 
showForm:function(id){ 
     if(!form) this.form = new Patients.view.Form(); 
     this.form.loadFormData(id); 
}, 
//columns:.... 

и в форме loadFormData() вы делаете решение зависит от id. если он равен нулю, создайте экземпляр модели и загрузите его, иначе извлеките запись (со всеми полями желаний) и загрузите ее.

Ext.define('Patients.view.Form',{ 
extend: 'Ext.form.Panel', 
xtype: 'patients_form', 
title: 'Patient Info', 

defaultType: 'textfield', 
items: [{ 
    fieldLabel:'Name', 
    name: 'name', 
    allowBlank: false, 
},{ 
    fieldLabel: 'Age', 
    name: 'age', 
    allowBlank: false 
},{ 
    fieldLabel: 'Phone', 
    name: 'phnumber', 
    allowBlank: 'false' 
}], 
    // docked items and else... 

loadFormData:function(id){ 
var me = this. 
if(!id){ 
    var record = new Patients.model.User(); 
    this.loadRecord(record); 
} 
else{ 
    var record = Patients.model.User.load(id,{ 
       callback:function(record){ 
           me.loadRecord(record); 
           var win = Ext.view.Window({ 
            items:[me], 
            }); 
           win.show(); 
           } 
      } 

} 
} 

Ext.data.Model.load() является статическим методом.

Наконец, вы создаете окно и добавляете к нему форму и вызываете шоу()