Sencha 2.x MVC: получить элемент по id - PullRequest
Новая
       24

Sencha 2.x MVC: получить элемент по id

0 голосов
/ 28 февраля 2012

Я только начал использовать Sencha Framework 2.x.Это мое приложение:

app / app.js 

Ext.Loader.setConfig({
  enabled: true
});
Ext.application({
  name: 'App',
  controllers: ['Generators'],
  models: [],
  stores: [],
  views: ['Main', 'Generator'],
  launch: function() {
    Ext.create('App.view.Main');
  }
});

app / view / Main.js 

Ext.define('App.view.Main', {
  extend: 'Ext.NavigationView',
  requires: [
    'App.view.Generator'
  ],

  config: {
    fullscreen: true,
    items: [
      {
        xtype: 'generatorview'
      }
    ]
  }
});

app / view / Generator.js 

Ext.define('App.view.Generator', {
  extend: 'Ext.Container',
  xtype: 'generatorview',
  id: 'generator',
  config: {
    layout: 'vbox',
    items: [
      {
        xtype: 'panel',
        html: 'My message: <a id="xxxSet">Set</a> :: <span id="xxxMsg">...</span>',
        flex: 1
      },
      {
        dock: 'bottom',
        xtype: 'toolbar',
        items: []
      }
    ]
  }
});

app / controller / Generator.js 

Ext.define('App.controller.Generators', {
  extend: 'Ext.app.Controller',
  config: {
    refs: {}
  },
  init: function() {
    this.control({
      '#xxxSet': { // QUESTION1
        tap: 'setMyMessage'
      }
    });
  },

  setMyMessage: function() {
    '#xxxMsg'.html('Set this message'); // QUESTION2
  }
});

Как видите, я поместил вопросы в последнюю часть (контроллер).

  • ВОПРОС1: Какможно установить функцию касания для элемента (#xxxSet), определенного в представлении в виде содержимого HTML.
  • ВОПРОС2: Как установить сообщение для элемента (#xxxMsg), определенного в представлении, как содержимое HTML.

xxxSet = id кнопки

xxxMsg = идентификатор владельца сообщения

Thx!

Ответы [ 2 ]

2 голосов
/ 28 февраля 2012

Вы можете использовать Ext # get (который принимает строку id), которая будет возвращать экземпляр Ext.dom.Element .При этом вы можете использовать метод on для добавления прослушивателей (очень похоже на control), а затем метод setHtml для обновления содержимого. 

init: function() {
    Ext.get('xxxSet').on({
        tap: 'setMyMessage',
        scope: this
    });
},

setMyMessage: function() {
    Ext.get('xxxMsg).setHtml('Hello');
}
0 голосов
/ 03 апреля 2014

Если вы используете itemId, вы не сможете получить к нему доступ с помощью Ext.get(). Вы можете попробовать Ext.ComponentQuery.query() вместо этого. 

init: function() {
Ext.ComponentQuery.query('#xxxSet').on({
    tap: 'setMyMessage',
    scope: this
  });
},

setMyMessage: function() {
 Ext.ComponentQuery.query('#xxxMsg).setHtml('Hello');
}
...