JQuery Autocomplete menu showing behind editor dialog

cbtdev

I have a custom autocomplete field type for my Editor and the autocomplete menu is rendering behind the Editor dialog. The naive approach to this is to set the z-index of the menu to one higher than the z-index of the dialog. It seems that the better approach would be to use the appendTo option for autocomplete. I found this post that suggests appending the menu to the dialog so that the proper z-index is inherited. Any ideas of how to achieve this with Editor?

Thanks in advance!

allan

Hi,

It should be possible to modify the plug-in code at line 4/5 to add the additional option telling it where to insert the plug-in.

However, I would urge a little bit of caution with this. The primary reason for which is that it will not only effect the z-index (or more accurately the DOM order), but it will place the auto complete list inside the Editor lightbox. That means that if it is larger than the lightbox (i.e. flows over the bottom) it will be visually cut off! The chosen plug-in works that way and it can be really ugly.

My own preference would actually be to just modify its z-index, but you might want to try the appendTo option and see what you think!

Regards,
Allan

cbtdev

Thank you Allan, you have convinced me that modifying the z-index for this case is the better option.

Cheers!