PDA

View Full Version : Click dialog body (iframe) to bring to front



Nullity
28 Jun 2007, 6:50 AM
I have a few dialogs that get created with an iframe as the body (sourcing a php file). When I have 2 or more dialogs open at once, to bring one from the background to the foreground I must click on the dialog header. Clicking in the body (the iframe) does nothing. This can cause problems if the header of the dialog I need is completely hidden behind another dialog; I must first move the top one away.

My first an main question is, can anyone think of a good solution to fix this, so when I click on the iframe, the dialog gets brought to the front?


Second, I have come up with a solution which adds an onClick handler to the body of each iframe, but it also has a slight problem that I can't figure out (and this may not be the best solution anyway).

Some of my dialogs consist of just a grid with a toolbar. I can open another dialog with record details by either double-clicking on a grid row or single clicking on a grid row, then clicking a button in the toolbar (using both so users don't get confused). When double-clicking a row, everything works as expected; however, when clicking on the toolbar button, the new dialog gets created, but the first dialog immediately gets brought back to the front.

Now I know that the toolbar button exists within the iframe body, which means clicking on it will bring that dialog to the front. What doesn't make sense to me is, the action of clicking the button triggers the creation of the new dialog, therefore chronologically, the dialog gets created after the button click event and should be the fore-most dialog by default - but that is not what's happening.


Here is the code I'm currently using:


var bDialog = new Ext.BasicDialog('dialog_id', {
... config ...
});

bDialog.show();

var clickToFront = function() {
var iframe = document.getElementById('iframe_id');
var doc = iframe.contentWindow || iframe.contentDocument;

if (doc.document) {
doc = doc.document;
}

Ext.get(doc.body).on('click', function() { bDialog.toFront(); });
};

bDialog.body.on('load', clickToFront);

Any ideas?

Nullity
28 Jun 2007, 10:46 AM
Removed by me.