EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: amir-t on February 23, 2014, 09:06:27 AM



Title: ComboTree - Set the zIndex of its panel
Post by: amir-t on February 23, 2014, 09:06:27 AM
Hi,
When i'm creating a comboTree it has an inner panel component which is appended to the html's body.
I have a problem when using the comboTree inside an external modal window, where the z-index value of the modal window (10000) is greater than the comboTree's panel div, and therefore the panel is not displaying when pressing the arrow button of the comboTree.
Is there a way to set the zIndex of the comboTree's panel div?

i've tried this following code, after the combotree is created:
Code:
var p=$(this).combotree('panel');
p.panel('panel').css('z-index', 20000);

But the problem is that when the combotree is loaded in browser,
when i'm trying to open its panel, my z-index is being overridden  and changed to 9001 (i noticed that the default z-index of easy ui window is 9000, so i guess its related in some way).

I actually need to change the z-Index of the combotree's panel in a way that it won't be changed by the comboTree's inside code, maybe by setting some property which the comboTree code will use.

How can i manage this ? is there another solution for this issue?

Thanks in advance.


Title: Re: ComboTree - Set the zIndex of its panel
Post by: stworthy on February 23, 2014, 05:34:17 PM
When the drop-down panel display, it will use the next z-index value greater than the value that window used. Thus it will always stay on top of window. If you want to manually set the z-index value of drop-down panel, please call jquery's css method in 'onShowPanel' event.
Code:
$('#ct').combotree({
onShowPanel:function(){
$(this).combotree('panel').panel('panel').css('zIndex', 20000);
}
})


Title: Re: ComboTree - Set the zIndex of its panel
Post by: amir-t on February 24, 2014, 02:53:05 AM
Thanks :)
it works.