Opened 6 years ago

Closed 6 years ago

Last modified 3 years ago

#9404 closed Bug (invalid)

Inline editing + dialog in iframe; Dialogs are positioned according to iframe and not main window.

Reported by: Jakub Ś Owned by:
Priority: Normal Milestone:
Component: UI : Dialogs Version: 4.0
Keywords: Cc:

Description (last modified by Jakub Ś)

This is a continuation of #9391.

To reproduce:

  1. Copy the attached file into ckeditor/samples folder and open it in a browser
  2. Click on any dialog button

Results: Dialogs is displayed below the viewport because it is positioned according to iframe (it is 1753px high) and not main window.

Attachments (1)

frame.html (717 bytes) - added by Jakub Ś 6 years ago.

Download all attachments as: .zip

Change History (8)

Changed 6 years ago by Jakub Ś

Attachment: frame.html added

comment:1 Changed 6 years ago by Jakub Ś

Description: modified (diff)
Status: newconfirmed

comment:2 Changed 6 years ago by Piotrek Koszuliński

Resolution: invalid
Status: confirmedclosed

The same happens for themed editor. And this is correct. Imagine that this iframe is tiny - 100px heigh. Then dialog centered according to main window will be invisible, because it'd be positioned out of iframe.

comment:3 Changed 6 years ago by Jakub Ś

@Reinmar small iframe is a good example her. The same applies to iframe aligned to left or right and not taking all the view port.

Despite this approach being valid for two above scenarios it is still invalid for this one scenario described in ticket thus I have one question however. Can't there be some config option for iframe that is bigger than viewport or better, for all frames? I'm talking about giving users possibility to choose according to what they want to position dialogs.

Last edited 6 years ago by Jakub Ś (previous) (diff)

comment:4 Changed 6 years ago by Piotrek Koszuliński

No, I think we'll never implement this. First of all I'm not even sure it's possible (rather not - just like we can't display dialogs in parent frame), second devs should take care of displaying iframe with reasonable size.

comment:5 Changed 6 years ago by Mike Burgh

If anyone is looking for a solution to this, here is a workaround you can tie to the dialogDefinition

CKEDITOR.on('dialogDefinition', dialogDefinition );

var dialogDefinition = function(e) {'show', function () {
	//So the dialog is right on the x, need to fix it's y to make it cetner viewport not center iframe we are in

	var editor = this.getParentEditor()
		,intFrameTop = $container.offset().top //get the top of the frame in the window that holds it
		,intScrollTop = $(top).scrollTop() //get scroll position
		,intFrameOffset =  intFrameTop - intScrollTop //frame offset
		,intDocumentHeight = $(top).height() //height of the current browser window
		,intPopupHeight = this.getSize().height
		,intNewTop = (intDocumentHeight/2) - (intPopupHeight/2) - intFrameOffset
		,objCurrentPos = this.getPosition()

	if (intNewTop < 0) {
		intNewTop = 5; //If it's under the frame pad it 5px off it the top of it!
	this.move( objCurrentPos.x, intNewTop ,false);


comment:6 Changed 3 years ago by Jakub Ś

#8113 was marked as duplicate.

comment:7 Changed 3 years ago by Jakub Ś

#13914 was marked as duplicate.

Note: See TracTickets for help on using tickets.
© 2003 – 2019 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy