can't edit fields in jQuery UI modal dialog

[psyafter]

I have a trouble with CKEditor about 1 year (all last versions from 3.0 till new version 3.3)

When I use ckeditor in "jQuery UI modal dialog" ( ​http://jqueryui.com/demos/dialog/#modal ) and try edit some properties of table (already created before) - so for example I can't edit numbers of rows and cells (both fields are disabled).

The same situation when I try edit alternate text in image window.

It's normal situation or it's a bug?

[Garry Yao]

Would you please attach an sample page with jqUI for us to make any judgement?

[psyafter]

yes, of course.

I was update sample page and uploaded it to test domain (with ckeditor files and jQuery + UI).

There is link to page: ​http://pmp.psymind.info/ckeditor/ajax.html

1) Open the dialog 2) Click on CreateEditor 3) Try to create table and edit rows/cell or any other field. It's disabled for editing. Same situation in creating image (editing alternate text)

[Frederico Caldeira Knabben]

Weird thing... much probably jQuery UI is catching the keystrokes.

[psyafter]

That will do solution for this situation?

[Jose S]

Verified on jQuery UI 1.8.5 and CKEditor 3.5 and not work focus dialog input. No z-index found.

[Jakub Ś]

I have checked this issue with latest jQuery UI 1.8.16, jQuery 1.6.4 and CKEditor 3.6.2.

Problem still occurs in IE7, Webkit and Opera (E.g. fields in cell properties dialog are not editable).

[rcjusto]

I could solve this, adding some lines in file "dialog.css" for the active skin, to setting all inputs in dialogs with position: relative and z-index: 9999.

.cke_skin_v2 input.cke_dialog_ui_input_text, .cke_skin_v2 input.cke_dialog_ui_input_password {
    background-color: white;
    border: none;
    padding: 0;
    width: 100%;
    height: 14px;
    /* new lines */
    position: relative;
    z-index: 9999;
}

The problem is caused by zIndex() function in jQueryUI library. That function only get the z-index property correctly if the object has absolute, relative or fixed position. This function is used in ui-dialog to validate what controls can gain the focus, when the dialog is modal.

Sorry by my english, I hope this can help someone.

[Jakub Ś]

@rcjusto thank you for the patch. Those two lines seem to fix the issue.

NOTE: The solution from #8443 (config.baseFloatZIndex = 102000;) does not work in this case.

[Andy Watson]

rcjusto's patch worked for us too.

Unfortunately this doesn't seem to have been 'fixed' or patched into the latest release of ckeditor for download on the main website. We spent 2 hours trying to track this problem down finally landing here. Will this be added to the release version?

[Jakub Ś]

Seems that this issue got fixed on trunk with rev. [7512]. Despite problems caused by this revision #9060 and fix for it provided in rev. [7524], it seems that good changes have stayed and this issue has expired on trunk.

[Jakub Ś]

Checked that once more seems that issue got fixed with CKEditor 3.6.4 rev. [7512]

[psyafter]

This bug present in version

• cke 4.0.1
• jquery.adapter
• jquery-1.9.1
• jqury-ui-1.10.0

[Oskar]

Created this ticket ​https://dev.ckeditor.com/ticket/10086. Have the same problem with

• cke 4.0.1
• jquery-1.8.3
• jqury-ui-1.10.0

[Chad]

Here is an example when we have buttons in the modal window and they work fine, maybe it can help: ​http://basicuse.net/articles/pl/scripting_languages/javascript/jquery_ui_widgets_dialog_windows

[Jakub Ś]

I think the best workaround is using e.g. jqury-ui-1.9.2 ( something below jqury-ui-1.10.0).

As mentioned in #10269, jqury-ui-1.10.0 has introduced some new problems.