jQuery Grid Plugin - jqGridForum

Topic RSS

jquery ui 1.10.2 autocomplete drop down renders behind jqgird form

18/03/2013
22:45

jbb43

Member

Members

Forum Posts: 3

Member Since:
17/03/2013

Offline

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?

19/03/2013
09:02

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

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

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

...

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

....

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

...

</style>

Enjoy

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

19/03/2013
23:10

jbb43

Member

Members

Forum Posts: 3

Member Since:
17/03/2013

Offline

Thanks 🙂 !

All RSS

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
73 Guest(s)

Currently Browsing this Page:
1 Guest(s)