jQuery Grid Plugin - jqGrid - Topic: jquery ui 1.10.2 autocomplete drop down renders behind jqgird form http://www.trirand.com/blog/?page_id=393/bugs/jquery-ui-1-10-2-autocomplete-drop-down-renders-behind-jqgird-form Simple:Press Version 5.7.5.3 jbb43 on jquery ui 1.10.2 autocomplete drop down renders behind jqgird form http://www.trirand.com/blog/?page_id=393/bugs/jquery-ui-1-10-2-autocomplete-drop-down-renders-behind-jqgird-form#p28484 Bugs http://www.trirand.com/blog/?page_id=393/bugs/jquery-ui-1-10-2-autocomplete-drop-down-renders-behind-jqgird-form#p28484 Thanks 🙂 !

]]> Tue, 19 Mar 2013 23:10:10 +0200 tony on jquery ui 1.10.2 autocomplete drop down renders behind jqgird form http://www.trirand.com/blog/?page_id=393/bugs/jquery-ui-1-10-2-autocomplete-drop-down-renders-behind-jqgird-form#p28477 Bugs http://www.trirand.com/blog/?page_id=393/bugs/jquery-ui-1-10-2-autocomplete-drop-down-renders-behind-jqgird-form#p28477 Hello,

Thanks for this post.

In diffrence to the answer from jquery ui I will give you a solution.

I do not thnik that this is a bug in jqGrid and uiAutocomplete. This is a way they work.

The simple answer is jqGrid form edit and uiAutocomplete have diffrent initial zIndex where both are not in sync.

Here is the solution. You have two options

1. To change the zIndex of jqGrid Form which is default 950

2. To change the zIndex of the uiAutocomplete (respectivley .ui-front) which default is 100

1.

jQuery("#jqgrid_m").jqGrid('navGrid','#jqpager_m',{edit:true,add:true,del:false,search:false,refresh:false},

   {zIndex:99}, // edit

   {zIndex:99} // add
);

and the second way

2.

...

dataInit : function(elem) {

$(elem).autocomplete({...});

$('.ui-autocomplete').css('zIndex',1000);

},

...

And finally I prefer to set the ui-front to some higer value than 100, since if you use the autocomplete

with other components you will have the same trouble.

So in youir main page after loading all ccs do

....

<style type="text/css">

.ui-front {
    z-index: 1000;
}

...

</style>

Enjoy

]]> Tue, 19 Mar 2013 09:02:13 +0200 jbb43 on jquery ui 1.10.2 autocomplete drop down renders behind jqgird form http://www.trirand.com/blog/?page_id=393/bugs/jquery-ui-1-10-2-autocomplete-drop-down-renders-behind-jqgird-form#p28475 Bugs http://www.trirand.com/blog/?page_id=393/bugs/jquery-ui-1-10-2-autocomplete-drop-down-renders-behind-jqgird-form#p28475 I tried to move to jquery ui 10.1, and discovered that using autocomplete on a jqgrid form results in the autocomplete drop down being displayed behind the 'add/edit' jqgrid form.

My old version that worked: jquery 1.8.2, ui 1.8.2, jqgrid 4.4.3. It also works fine if I go up to query 1.9, and ui 1.9

Here is a test case for you: http://jsfiddle.net/jbb43/qASZT/8/

I posted a bug ticket to jquery, and got the following response from them:

"This is a bug in jqGrid. jqGrid is using a custom dialog and not utilizing .ui-front."

Is there a workaround I can use?

]]> Mon, 18 Mar 2013 22:45:10 +0200