AMBARI-14589. [UI] Kerberos-> Configs -> description tooltip is not appearing for checkboxes (onechiporenko)

ambari-web/app/templates/common/configs/service_config_category.hbs

@@ -55,7 +55,7 @@
                   <span {{bindAttr class="isEditable::muted"}}>{{formatWordBreak displayName}}</span>
                 {{/if}}
                 {{#if hintMessage}}
-                  <a class="icon-question-sign icon-blue" href="#" data-toggle="tooltip" {{bindAttr data-original-title="hintMessage"}}><a/>
+                  <a class="icon-question-sign icon-blue" href="#" data-toggle="tooltip" {{bindAttr data-original-title="hintMessage"}}></a>
                 {{/if}}
                 {{#if this.isComparison}}
                   {{#if controller.selectedConfigGroup.isDefault}}

ambari-web/app/views/common/controls_view.js

@@ -50,18 +50,34 @@ App.ServiceConfigPopoverSupport = Ember.Mixin.create({
     });
     // if description for this serviceConfig not exist, then no need to show popover
     if (this.get('isPopoverEnabled') !== 'false' && this.get('serviceConfig.description')) {
-      App.popover(this.$(), {
-        title: Em.I18n.t('installer.controls.serviceConfigPopover.title').format(
-          this.get('serviceConfig.displayName'),
-          (this.get('serviceConfig.displayName') == this.get('serviceConfig.name')) ? '' : this.get('serviceConfig.name')
-        ),
-        content: this.get('serviceConfig.description'),
-        placement: this.get('popoverPlacement'),
-        trigger: 'hover'
-      });
+      this.addPopover();
     }
   },
 
+  /**
+   * Element where popover is "appended"
+   */
+  elementForPopover: function () {
+    return this.$();
+  }.property(),
+
+  /**
+   * Add Popover for config-boxes
+   *
+   * @method addPopover
+   */
+  addPopover: function () {
+    App.popover(this.get('elementForPopover'), {
+      title: Em.I18n.t('installer.controls.serviceConfigPopover.title').format(
+        this.get('serviceConfig.displayName'),
+        (this.get('serviceConfig.displayName') === this.get('serviceConfig.name')) ? '' : this.get('serviceConfig.name')
+      ),
+      content: this.get('serviceConfig.description'),
+      placement: this.get('popoverPlacement'),
+      trigger: 'hover'
+    });
+  },
+
   willDestroyElement: function() {
     this.$().popover('destroy');
   },
@@ -317,10 +333,14 @@ App.ServiceConfigCheckbox = Ember.Checkbox.extend(App.ServiceConfigPopoverSuppor
 
   checked: false,
 
+  elementForPopover: function () {
+    return this.$().parent('.control-group').find('.bootstrap-checkbox');
+  }.property(),
+
   /**
    * set appropriate config values pair
    * to define which value is positive (checked) property
-   * and what value is negative (unchecked) proeprty
+   * and what value is negative (unchecked) property
    */
   didInsertElement: function() {
     var self = this;
@@ -335,13 +355,16 @@ App.ServiceConfigCheckbox = Ember.Checkbox.extend(App.ServiceConfigPopoverSuppor
     this.set('checked', this.get('serviceConfig.value') === this.get('trueValue'));
     this.propertyDidChange('checked');
     Em.run.next(function () {
-      if (self.$())
+      if (self.$()) {
         self.$().checkbox({
           defaultState: self.get('serviceConfig.value'),
           buttonStyle: 'btn-link btn-large',
           checkedClass: 'icon-check',
           uncheckedClass: 'icon-check-empty'
         });
+        self.propertyDidChange('elementForPopover');
+        self.addPopover();
+      }
     });
   },