PDA

View Full Version : Overriding closeClicked method



bidyut
7 Dec 2006, 5:03 PM
i want to override the closeClicked method to hide the panel instead of removing it. I tried this code:


layout.add('center', new YAHOO.ext.ContentPanel('aPanel', {title: 'Panel 2', closable:true})).override({
closeClicked : function() {
alert("hello");
}
});



But it does not throw the alert.

Instead it still removes the panel.

Is there anything wrong in the code?

Thanks!

tryanDLS
7 Dec 2006, 8:28 PM
Rather than trying to override the method, why don't you remove the closeBtn click listener and add your own to hide the panel

Animal
7 Dec 2006, 10:18 PM
i want to override the closeClicked method to hide the panel instead of removing it. I tried this code:


layout.add('center', new YAHOO.ext.ContentPanel('aPanel', {title: 'Panel 2', closable:true})).override({
closeClicked : function() {
alert("hello");
}
});



But it does not throw the alert.

Instead it still removes the panel.

Is there anything wrong in the code?

Thanks!


I'm confused as to how this code is even running.

ContentPanel does not have an override method. Do you have Firebug? You should see Javascript errors.

To override a method in the Layout:



YAHOO.override(layout, { closeClicked:function(){alert("hello")}});


Which would replace the method in the prototype. If you really wanted to do that.

bidyut
8 Dec 2006, 6:48 AM
Thanks. I am still learning :) But the code does run without any error. Firebug does not complain either. I wrote it that way after seeing a code snippet mentioned in this forum.

jbowman
8 Dec 2006, 8:46 AM
next step would be to throw it in a try/catch statement, as the error may not be being returned to the console.

bidyut
9 Dec 2006, 12:24 AM
I htink the most elgant way of adding a panel is using iframe instead of using div. But then i am learning this framework day by day. So I am much more comfortable using iframe and it is also cleaner.

genius551v
9 Dec 2006, 7:25 AM
tryanDLS, sound very interesting


Rather than trying to override the method, why don't you remove the closeBtn click listener and add your own to hide the panel

can you post some example of how do that?

Tnks

jack.slocum
9 Dec 2006, 8:51 AM
override() is added to every prototype and class that uses extendX.

For example:


YAHOO.ext.LayoutRegion.override({
someFunction : function(){
...
}
});

That overrides someFunction on the prototype (for all LayoutRegions).

You can also use it on individual objects:


var r = layout.getRegion('north'); // return LayoutRegion object
r.override({
someFunction : function(){
...
}
});

This overrides someFunction on just that specific instance (not the prototype).

The problem with your code is that closeClicked() is on the TabPanelItem, not the LayoutRegion. So overriding it on the region does nothing.

What you are looking for is the event "beforeremove". You can use this event to cancel the remove and just hide the panel.

bidyut
9 Dec 2006, 11:21 AM
Jack, thanks for the response. Now the overriding part is more clear to me. I had that doubt from the beginning that I am not overriding the function at the right DOM level. And you confirmed it.:)

However, using iframe solved my problem. Hiding and showing the panel would have worked, but in longer run it might have created more problem with browser holding up more memory and updating the panel appropriately with ajax data etc. But iframe solves many of those problem.

While on this subject, is it possible to add mode buttons to the panel title bar. Currently if we set "closable: true", the close icon shows up. Is there a dom manipulation API or other helper API to add more buttons up there with functions attached to them?

Thanks again for getting some time out to answer and clear my confusion.

jack.slocum
9 Dec 2006, 12:43 PM
The region has a createTool method (private) that you can hack at. There is no public way to do this yet.