Sasha Sydoruk

Building a better mousetrap with XHTML, AJAX and RSS

Safari + AutoComplete Extender + ModalPopup = What the hell?

If you have a bunch of AutoComplete extenders that are wrapped inside of ModalPopup and you try to run it in Safari, chances are, you will not like what you see. The autocomplete div will be shown under the modalpopup. Works fine in Firefox and IE, but Safari is screwed up. What gives?

Well, if you look into source code of AutoComplete extender, you will notice that they have a special handling for Safari (also known as a one-button mouse of the browsers :) Just kidding!). Because of this special handling, the correct z-index is not being set on the autocomplete div.

But how can I fix it? Well, all you need to do is to add a div somewhere near the extender with id of “AutoCompleteDiv” and in your extender set the property of CompletionListElementID to “AutoCompleteDiv”.

Here is how I found this info:

Also, there is a custom autocomplete extender based on prototype and script.ac.ulous. I have not tried but it looks really interesting. I would like to take a look the source when I have a bit more time. Here is the link.

No comments yet. Be the first.

Leave a reply