Hi guys,
Im adding panels onto my panel by looping through an array that i have that contains panel objects and i have a bit of code that does this inside the loop:
p.panel({
title:widgetDetails.title,
content:'<div style="padding:5px;" collapsible="true" id="'+widgetDetails.id+'"><iframe width="100%" height="100%" frameborder="0" src="widgets/'+widgetDetails.filename+'"></iframe></div>',
height:widgetDetails.height,
closable:true,
collapsible:true,
collapsed:widgetDetails.collapsed,
maximizable:widgetDetails.maximizable,
onMaximize:function(msg){
alert(widgetDetails.externalApp);
}
});
$('#pp').portal('add', {
panel:p,
columnIndex:widgetDetails.columnIndex
});
This is all working fine, however where i have the onMaximize function, the parameter that i am passing in (widgetDetails.externalApp) is always equal to the last widget. So for example, if i have 3 widgets and the externalApp values are equal to 1, 2, 3 respectively then when ever i click on the maximize button on any of the panels i always see an alert saying '3'. What would i have to do so that if i click on the expand button on the first panel i see an alert saying '1' and an alert saying '2' if i expand the second panel etc?
I assumed that by doing the above code, i was assigning the maximise function to the panel currently found in the loop, instead it seems to be doing it for all panels. Is there a way around this?
Thanks