diff options
author | Petr Vobornik <pvoborni@redhat.com> | 2012-07-27 16:31:58 +0200 |
---|---|---|
committer | Petr Vobornik <pvoborni@redhat.com> | 2012-08-01 13:12:33 +0200 |
commit | 7a2587e6a15b59b857ab973490b2f6eb9fc9ebe0 (patch) | |
tree | 32a7183218659eb90a74e1b9d9fd0de14289fc18 /install | |
parent | 68d5fe1ec7d785f127b3513f84cc632cdb1f9167 (diff) | |
download | freeipa-7a2587e6a15b59b857ab973490b2f6eb9fc9ebe0.tar.gz freeipa-7a2587e6a15b59b857ab973490b2f6eb9fc9ebe0.tar.xz freeipa-7a2587e6a15b59b857ab973490b2f6eb9fc9ebe0.zip |
Fixed: Unable to select option in combobox in IE and Chrome
There's probably a bug regarding z-index stacking in Chrome and IE. It appears when combobox is used in dialog. Combobox's select area had z-index=1010. When first jquery dialogs is open it has z-index=1000. Further dialogs have higher z-index. When dialog's z-index exceeds 1010 option in select control can't be selected. IMO it is a browser bug because select control lies in dialog content's stacking context so it should be functional even with z-index=1.
This patch raises select area's z-index to 9000000 which should prevent the issue for some time. Also it make's combobox's z-index configurable so we can solve combobox stacking (ie in service-add dialog).
Second part of:
https://fedorahosted.org/freeipa/ticket/2834
Diffstat (limited to 'install')
-rw-r--r-- | install/ui/ipa.css | 1 | ||||
-rw-r--r-- | install/ui/widget.js | 14 |
2 files changed, 8 insertions, 7 deletions
diff --git a/install/ui/ipa.css b/install/ui/ipa.css index 4f9d35c1d..e5395b4a0 100644 --- a/install/ui/ipa.css +++ b/install/ui/ipa.css @@ -1343,7 +1343,6 @@ table.scrollable tbody { position: absolute; left: 0; right: 0; - z-index: 1010; /* need to be above dialog box */ } .combobox-widget-list input { diff --git a/install/ui/widget.js b/install/ui/widget.js index 41767118e..8f9d8b075 100644 --- a/install/ui/widget.js +++ b/install/ui/widget.js @@ -2093,6 +2093,7 @@ IPA.combobox_widget = function(spec) { that.empty_option = spec.empty_option === undefined ? true : spec.empty_option; that.options = spec.options || []; that.input_field_changed = IPA.observer(); + that.z_index = spec.z_index ? spec.z_index + 9000000 : 9000000; that.create = function(container) { that.widget_create(container); @@ -2151,7 +2152,8 @@ IPA.combobox_widget = function(spec) { }).appendTo(that.input_container); that.list_container = $('<div/>', { - 'class': 'combobox-widget-list' + 'class': 'combobox-widget-list', + css: { 'z-index': that.z_index } }).appendTo(that.input_container); var div = $('<div/>', { @@ -2187,7 +2189,8 @@ IPA.combobox_widget = function(spec) { name: 'list', size: that.size, style: 'width: 100%', - change: that.select_on_change + change: that.select_on_change, + click: that.select_on_change }).appendTo(div); if (that.undo) { @@ -2201,7 +2204,7 @@ IPA.combobox_widget = function(spec) { if (!that.is_open()) return; - var value = $('option:selected', that.list).val(); + var value = that.list.val(); that.input.val(value); IPA.select_range(that.input, 0, 0); @@ -2327,10 +2330,9 @@ IPA.combobox_widget = function(spec) { }; that.create_option = function(label, value) { - return $('<option/>', { + var option = $('<option/>', { text: label, - value: value, - click:that.select_on_change + value: value }).appendTo(that.list); }; |