I simply want to add a hyper link in my application. I tried the following code and the link is appearing in the page. But the on click event is not working. Can anyone please tell me what might be the reason?

xtype:'box',
isFormField: true,
id: "prospectStageLink",
style: "padding: 3px",
autoEl:{
    //html: '&nbsp;<a href>Link To Prospect</a>'
    tag: 'a',
    href: '#',
    cn: 'Link To Prospect'
},
listeners: {
    render: function(c){
        c.on('click', function(e){
            alert('clicked', 'hiii');
        }, c, { stopEvent: true });
    }
}

I simply want to add a hyper link in my application. I tried the following code and the link is appearing in the page. But the on click event is not working. Can anyone please tell me what might be the reason?

xtype:'box',
isFormField: true,
id: "prospectStageLink",
style: "padding: 3px",
autoEl:{
    //html: '&nbsp;<a href>Link To Prospect</a>'
    tag: 'a',
    href: '#',
    cn: 'Link To Prospect'
},
listeners: {
    render: function(c){
        c.on('click', function(e){
            alert('clicked', 'hiii');
        }, c, { stopEvent: true });
    }
}

• javascript
• extjs
• hyperlink

Share Improve this question Follow edited Nov 18, 2011 at 11:21 Chau 5,57099 gold badges6767 silver badges9999 bronze badges asked Nov 18, 2011 at 9:36 spvspv 7511 silver badge99 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

try this :

listeners: {
    render: function(ponent) {
        ponent.getEl().on('click', function(e) {
            alert('test');
        });    
    }
}

I assume you are not running on ExtJS 4, because BoxComponent was removed from it.

Anyways, the simple explanation is probably that BoxComponent does not have a click event. You might want to try using an Element instead, which does have support for the click event.

xtype:'box',
isFormField: true,
id: "prospectStageLink",
style: "padding: 3px",
autoEl:{
    //html: '&nbsp;<a href>Link To Prospect</a>'
    tag: 'a',
    href: '',
    onClick: 'nameYouFunction'
}