Установка значений поля окна из контроллера

Question

У меня есть окно, в котором отображаются значения о пользователе во всплывающем окне при нажатии на определенную ячейку. В моем UserController я загружаю json пользователя на основе id, есть ли способ пройти конкретные значения этого json в моем окне? Я знаю, что я мог бы использовать .getForm(). SetValues ​​(), если бы это была форма. Могу ли я вложить форму внутри моего окна?

контроллер фрагмент кода:

loadUserDetails: function(userId) { 
     var view = Ext.widget('userdetails').show(); 
     Ext.Ajax.request({ 
      url: /user/get.htm?alt=json', 
       params: { id: userId }, 
      success: function(response) { 
       var json = Ext.JSON.decode(response.responseText); 
      } 
     }); 
    } 

Просмотр фрагмента (окно):

Ext.define('App.view.user.UserDetails', { 
    extend: 'Ext.window.Window' 
    ,alias: 'widget.userdetails' 
    ,id: 'userdetails' 
    ,title: 'User Details' 
    ,height: 300 
    ,width: 380 

    ,initComponent: function() { 
     var me = this; 
     this.items = [{ 
      xtype: 'fieldset', 
      title: 'Information', 
      margin: '5', 
      width: 350, 
      height: 250, 
      defaults: {xtype: 'displayfield', margin: '3', labelWidth: 100, width: 300}, 
      items: [{ 
       id: 'id', 
       width: 150, 
       fieldLabel: 'User Id' 
      },{ 
       id: 'email', 
       width: 250, 
       fieldLabel: 'User Email' 
      }] 

     }]; 
     this.callParent(arguments); 
    } 
}); 

Answer 1

Учитывая этот класс:

Ext.define('App.view.user.UserDetails', { 
    extend: 'Ext.window.Window' 
    ,alias: 'widget.userdetails' 
    ,id: 'userdetails' 
    ,title: 'User Details' 
    ,height: 300 
    ,width: 380 
    ,items: [{ 
     xtype: 'fieldset', 
     title: 'Information', 
     margin: '5', 
     width: 350, 
     height: 250, 
     defaults: {xtype: 'displayfield', margin: '3', labelWidth: 100, width: 300}, 
     items: [{ 
      // you should avoid using fixed id that will prevent using the component 
      // multiple times 
      // id: 'id', 
      width: 150, 
      fieldLabel: 'User Id' 

      ,itemId: 'userId' // <= add item id for easy retrieval 
     },{ 
      // id: 'email', 
      width: 250, 
      fieldLabel: 'User Email' 

      ,name: 'userEmail' // <= or a name, as is logical for a field 
     }] 
    }] 
}); 

Вы можете использовать component queries, чтобы получить ссылку на вашем поле и установить его значение:

var win = Ext.create('App.view.user.UserDetails', { 
    autoShow: true 
}); 

// query by itemId 
win.down('#userId').setValue(123); 

// or by name 
win.down('field[name=userEmail]').setValue('user@example.com'); 

Или вы можете вложить форму в окне, так что вы можете использовать setValues (и другие особенности формы):

Ext.define('App.view.user.UserDetails', { 
    extend: 'Ext.window.Window' 
    ,alias: 'widget.userdetails' 
    ,id: 'userdetails' 
    ,title: 'User Details' 
    ,height: 300 
    ,width: 380 
    ,layout: 'fit' 
    ,items: [{ 
     xtype: 'form' 
     ,items: [{ 
      xtype: 'fieldset', 
      title: 'Information', 
      margin: '5', 
      width: 350, 
      height: 250, 
      defaults: {xtype: 'displayfield', margin: '3', labelWidth: 100, width: 300}, 
      items: [{ 
       width: 150, 
       fieldLabel: 'User Id' 
       // name is required for setValues to work 
       ,name: 'userId' 
      },{ 
       // id: 'email', 
       width: 250, 
       fieldLabel: 'User Email' 
       ,name: 'userEmail' 
      }] 
     }] 
    }] 
}); 

var win = Ext.create('App.view.user.UserDetails', { 
    autoShow: true 
}); 

win.down('form').setValues({ 
    ... 
});