Într-o fereastră de dialog jQuery UI avem un widget autocomplete asociat unui câmp text. La prima afișare a listei de rezultate, totul este afișat normal. Însă, dacă închidem lista de rezultate fără să fi selectat vreun rezultat, iar apoi redeschidem lista prin tastarea unui caracter în câmpul text, vom observa că lista este afișată în spatele ferestrei de dialog.
Acest lucru se întâmplă pentru că la închiderea/ascunderea listei de rezultate, parametrul z-index al ferestrei de dialog este setat automat la o valoare cu 1 mai mare decât cea a listei de rezultate. Deci, dacă lista de rezultate a avut z-index:1000, la închiderea acesteia, fereastra de dialog va avea z-index:1001. Asta înseamnă că la următoarea afișare a listei de rezultate (z-index:1000), fără să fi închis fereastra de dialog, lista va fi deschisă în spatele ferestrei de dialog (z-index:1001).
Soluția propusă este ca la fiecare afișare a listei de rezultate parametrii z-index ai celor două elemente (lista de rezultate și fereastra de dialog) să fie setați manual:
open:function(){
$(this).autocomplete('widget').css('z-index', 1000);
$('.ui-dialog').css('z-index', 999);
}