Can't call function from div layer (am desperate)

[guvenck]

Hello,

I am using GreyBox (http://orangoo.com/labs/GreyBox/) (which is a lightbox kind of popup window layer) on one of my sites.

On the site, somewhere I use Panels -sort of a Context Menu (div layers) that appear when
clicked on a link and give me options about the link.

Keep it simple, this is how I call a panel (There is some PHP involved
but ignore it):


<a id="panel$ID" href="#" onClick="return Panel($ID, $title);">$title</a>

and my JS function is as follows:



function Panel(id,title) {
if (PanelLoaded[id]) {
closePanel(id);
return false;
}
PanelLoaded[id] = true;
contBoxid = 'panel'+id;
var contBox = document.getElementById(contBoxid);
box = document.createElement('div');
box.className = 'contbox';
box.id = 'contbox'+id;
box.style.cursor = 'default';
box.style.position = 'absolute';
box.style.marginTop = '5px';
box.style.marginLeft = '10px';
box.style.padding = '5px';
box.style.width = '280px';
box.style.textAlign = 'left';
box.style.backgroundColor = '#003366';
box.style.border = 'solid 1px #000000';
box.style.MozBorderRadius = '7px';

box.innerHTML = ''+
'<table>'+
'<tr>'+
'<td>'+title+'</td>'+
'</tr>'+
'<tr>'+
'<td><a href="books.php?op=showbook&bid='+id+'"
onClick="closePanel('+id+');">Info</a></td>'+
'</tr>'+
'<tr>'+
'<td><a href="mylists.php?bid='+id+'" title="My Lists"
rel="gb_page_center[400, 300]" onClick="closePanel('+id+');">View
Lists</a></td>'+
'</tr>'+
'<tr>'+
'<td><a href="#" onClick="return closePanel(\''+id+'\')">Close</a></
td>'+
'</tr>'+
'</table>';

contBox.parentNode.appendChild(box);
return false;

}

function closePanel(id) {
boxid = 'contbox'+id;

document.getElementById(boxid).parentNode.removeChild(document.getElementById(boxid));
PanelLoaded[id] = false;
return false;

}


If you look at the Lists part - this is where call the GreyBox function with rel attribute.

If I load the page and click on the link, the Panel comes up and when
I click "View Lists", GreyBox does not come up, instead the browser
loads the page that GreyBox should have loaded.

So, how can I call the gb_page_center from this panel? I tried adding
parent, parent.parent, top.window before gb_page_center but it did not help.

Any help is highly appreciated.

[jscheuer1]

Your problem most likely is the same as with lightbox in these situations. What you have is content for greybox being added to the page after the page has loaded. Greybox only initializes on page load so, your added content isn't initialized to the greybox script and acts like an ordinary link.

Hopefully you can adapt this solution:

http://www.dynamicdrive.com/forums/showthread.php?t=17426

[guvenck]

I will try your solution asap. Meanwhile I'd like to report that I solved the problem (thanks to helpful GreyBox guys) by using a GB function with the onClick attribute:



onClick="closePanel('+id+'); return GB_showCenter('PageTitle',
this.href, 400, 300);"

[jscheuer1]

If that works for you, it is probably a better solution as it doesn't require repeat initializations which, can add up (at least in IE) and cause memory leaks.