I'm struggling with a really simple problem here.

I want to generate a normal link in frontend but it seems to don't work somehow. Here is the code I use for the generation of the link (the link was a button before which opened a new window with a specified URL on click).

{
  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;
  }
}
}

When ExtJS renders the button it makes, hence I add an html attribute to the object, a link out of it.

I can see the link with FireBug. When I click the link I get the output

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

in the console

So the event is fired. But the link gets never opened.

I think it has something to do with the CLICK-event getting stopped from ExtJS.

It seems that despite in Firebug there is no button in the HTML the object passed to the click event is still the button.

So me question is, how can a create normal HTML in ExtJS without setting a xtype of button. Or how can I generate a normal link.

I used to open a popup after the button was clicked. The popup got blocked from Chrome, IE and various other browser so I have to use a normal link with a URL instead.

I'm struggling with a really simple problem here.

I want to generate a normal link in frontend but it seems to don't work somehow. Here is the code I use for the generation of the link (the link was a button before which opened a new window with a specified URL on click).

{
  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;
  }
}
}

When ExtJS renders the button it makes, hence I add an html attribute to the object, a link out of it.

I can see the link with FireBug. When I click the link I get the output

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

in the console

So the event is fired. But the link gets never opened.

I think it has something to do with the CLICK-event getting stopped from ExtJS.

It seems that despite in Firebug there is no button in the HTML the object passed to the click event is still the button.

So me question is, how can a create normal HTML in ExtJS without setting a xtype of button. Or how can I generate a normal link.

I used to open a popup after the button was clicked. The popup got blocked from Chrome, IE and various other browser so I have to use a normal link with a URL instead.

• javascript
• extjs
• hyperlink
• click
• dom-events

2 Answers 2

Got an answer to my question in ExtJS forum

Use LinkButton an extension written by Animal

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

You can also use the html property of a label ponent and call a controller function from there. Example:

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