From 7a2587e6a15b59b857ab973490b2f6eb9fc9ebe0 Mon Sep 17 00:00:00 2001
From: Petr Vobornik <pvoborni@redhat.com>
Date: Fri, 27 Jul 2012 16:31:58 +0200
Subject: [PATCH 56/79] 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
---
 install/ui/ipa.css   |  1 -
 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 4f9d35c1d2a5e458903793423c6fad4de657554e..e5395b4a0cdeadec539aa1f18306b666dfca807d 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 41767118e78dce3f2ff4c30bdcf8368e0d1e976a..8f9d8b075fbbcf640cc5f0cf43e6ba1ce6e1989e 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);
     };
 
-- 
1.7.11.2