Merge pull request #12888 from AparnaKarve/gh12840_fix_selectpicker_init

Fixed selectpicker directive to apply initialization irrespective of the model value (cherry picked from commit a10d08a) https://bugzilla.redhat.com/show_bug.cgi?id=1404447
ManageIQ · Jan 9, 2017 · c7eb535 · c7eb535
1 parent 42444ee
commit c7eb535
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 19 deletions.
diff --git a/app/assets/javascripts/directives/selectpickerForSelectTag.js b/app/assets/javascripts/directives/selectpickerForSelectTag.js
@@ -5,17 +5,15 @@ ManageIQ.angular.app.directive('selectpickerForSelectTag', function() {
       scope['form_' + ctrl.$name] = elem[0];
 
       scope.$watch(attr.ngModel, function() {
-        if((ctrl.$modelValue != undefined)) {
-          $(scope['form_' + ctrl.$name]).selectpicker({
-            dropupAuto: false
-          });
-          $(scope['form_' + ctrl.$name]).selectpicker('show');
-          $(scope['form_' + ctrl.$name]).selectpicker('refresh');
-          $(scope['form_' + ctrl.$name]).addClass('span12').selectpicker('setStyle');
-        }
+        angular.element(scope['form_' + ctrl.$name]).selectpicker({
+          dropupAuto: false,
+        });
+        angular.element(scope['form_' + ctrl.$name]).selectpicker('show');
+        angular.element(scope['form_' + ctrl.$name]).selectpicker('refresh');
+        angular.element(scope['form_' + ctrl.$name]).addClass('span12').selectpicker('setStyle');
       });
       scope.$watch('loaded.bs.select', function() {
-        $('.bootstrap-select button').removeAttr('title');
+        angular.element('.bootstrap-select button').removeAttr('title');
       });
 
       scope.$on('$destroy', function () {

diff --git a/app/views/cloud_volume/attach.html.haml b/app/views/cloud_volume/attach.html.haml
@@ -1,16 +1,16 @@
-%form#form_div{:name => "angularForm", 'ng-controller' => "cloudVolumeFormController"}
+%form#form_div{:name => "angularForm", 'ng-controller' => "cloudVolumeFormController", "ng-cloak" => ""}
   = render :partial => "layouts/flash_msg"
   %h3
     = _('Attach Volume')
   .form-horizontal
-    .form-group
-      %label.col-md-2.control-label
+    .form-group{"ng-class" => "{'has-error': angularForm.vm_id.$invalid}"}
+      %label.col-md-2.control-label{"for" => "vm_id"}
         = _('Instance')
       .col-md-8
         = select_tag("vm_id",
-                      options_for_select(@vm_choices.sort),
+                      options_for_select([["<#{_('Choose')}>", nil]] + @vm_choices.sort, disabled: ["<#{_('Choose')}>", nil]),
                       "ng-model"                    => "cloudVolumeModel.vm_id",
-                      :miqrequired                  => true,
+                      "required"                    => true,
                       :checkchange                  => true,
                       "selectpicker-for-select-tag" => "")
     .form-group

diff --git a/app/views/cloud_volume/detach.html.haml b/app/views/cloud_volume/detach.html.haml
@@ -1,16 +1,16 @@
-%form#form_div{:name => "angularForm", 'ng-controller' => "cloudVolumeFormController"}
+%form#form_div{:name => "angularForm", 'ng-controller' => "cloudVolumeFormController", "ng-cloak" => ""}
   = render :partial => "layouts/flash_msg"
   %h3
     = _('Detach Volume')
   .form-horizontal
-    .form-group
-      %label.col-md-2.control-label
+    .form-group{"ng-class" => "{'has-error': angularForm.vm_id.$invalid}"}
+      %label.col-md-2.control-label{"for" => "vm_id"}
         = _('Instance')
       .col-md-8
         = select_tag("vm_id",
-                      options_for_select(@vm_choices.sort),
+                      options_for_select([["<#{_('Choose')}>", nil]] + @vm_choices.sort, disabled: ["<#{_('Choose')}>", nil]),
                       "ng-model"                    => "cloudVolumeModel.vm_id",
-                      :miqrequired                  => true,
+                      "required"                    => true,
                       :checkchange                  => true,
                       "selectpicker-for-select-tag" => "")