Создать нормальную ссылку (<a href="...">) в ExtJS - PullRequest
4 голосов
/ 16 июля 2010

Я борюсь с действительно простой проблемой здесь.

Я хочу создать нормальную ссылку во внешнем интерфейсе, но, похоже, она не работает. Вот код, который я использую для генерации ссылки (ссылка была кнопкой, перед которой открывалось новое окно с указанным URL-адресом при нажатии).

{
  xtype: 'button',
  id: 'PrintTool',
  tooltip: 'Printer Friendly',
  iconCls: 'icon-printerFriendly',
  html: '<a href=\"http:\/\/www.google.at\">x<\/a>',
  listeners: {
    'click': function(button,event) {
      console.log(this);
      console.log(event);
      this.restoreClick();
      return true;
  }
}

}

Когда ExtJS отображает кнопку, которую он делает, следовательно, я добавляю html-атрибут к объекту, ссылку из него.

Я вижу ссылку с FireBug. Когда я нажимаю на ссылку, я получаю вывод

    console.log(this);
    console.log(event);

в консоли

Итак, событие запущено. Но ссылка никогда не открывается.

Я думаю, это как-то связано с остановкой CLICK-события из ExtJS.

Кажется, что, несмотря на то, что в Firebug в HTML нет кнопки, объект, переданный событию click, все еще является кнопкой.

Так что мне вопрос, как можно создать нормальный HTML в ExtJS без установки кнопки типа x. Или как мне создать нормальную ссылку.

Раньше я открывал всплывающее окно после нажатия кнопки. Всплывающее окно заблокировано из-за Chrome, IE и других браузеров, поэтому мне приходится использовать обычную ссылку со вставленным URL-адресом.

Ответы [ 2 ]

4 голосов
/ 16 июля 2010

Получил ответ на мой вопрос в форуме ExtJS

Используйте LinkButton расширение, написанное Animal

http://www.sencha.com/forum/showthread.php?80639-Ext.LinkButton-A-button-class-which-renders-an-lt-a-gt-element./page3

1 голос
/ 17 мая 2014

Вы также можете использовать свойство html компонента label и вызывать функцию контроллера оттуда.Пример:

{xtype: 'label',
html: 'bla bla? <a href="#" onClick="javascript:appName.app.getController(\'myController\').showRegistration();">Register</a>'
}
...