appending ui-select-header and ui-select-footer as li items onto ul.ui-select-choices

Author: plong0

dist/select.js

@@ -965,11 +965,6 @@ uis.directive('uiSelect',
           // instead of creating a hackish DOM element:
           var transcluded = angular.element('<div>').append(clone);
 
-          var transcludedHeader = transcluded.querySelectorAll('.ui-select-header');
-          transcludedHeader.removeAttr('ui-select-header'); //To avoid loop in case directive as attr
-          transcludedHeader.removeAttr('data-ui-select-header'); // Properly handle HTML5 data-attributes
-          element.querySelectorAll('.ui-select-header').replaceWith(transcludedHeader);
-
           var transcludedMatch = transcluded.querySelectorAll('.ui-select-match');
           transcludedMatch.removeAttr('ui-select-match'); //To avoid loop in case directive as attr
           transcludedMatch.removeAttr('data-ui-select-match'); // Properly handle HTML5 data-attributes
@@ -986,10 +981,21 @@ uis.directive('uiSelect',
           }
           element.querySelectorAll('.ui-select-choices').replaceWith(transcludedChoices);
 
+          var transcludedHeader = transcluded.querySelectorAll('.ui-select-header');
+          if(transcludedHeader && transcludedHeader.length){
+            transcludedHeader.removeAttr('ui-select-header'); //To avoid loop in case directive as attr
+            transcludedHeader.removeAttr('data-ui-select-header'); // Properly handle HTML5 data-attributes
+            $timeout(function(){
+              transcludedChoices.prepend(transcludedHeader);
+            });
+          }
+
           var transcludedFooter = transcluded.querySelectorAll('.ui-select-footer');
-          transcludedFooter.removeAttr('ui-select-footer'); //To avoid loop in case directive as attr
-          transcludedFooter.removeAttr('data-ui-select-footer'); // Properly handle HTML5 data-attributes
-          element.querySelectorAll('.ui-select-footer').replaceWith(transcludedFooter);
+          if(transcludedFooter && transcludedFooter.length){
+            transcludedFooter.removeAttr('ui-select-footer'); //To avoid loop in case directive as attr
+            transcludedFooter.removeAttr('data-ui-select-footer'); // Properly handle HTML5 data-attributes
+            transcludedChoices.append(transcludedFooter);
+          }
         });
 
         // Support for appending the select field to the body when its open
@@ -1848,15 +1854,15 @@ uis.directive('uiSelectSort', ['$timeout', 'uiSelectConfig', 'uiSelectMinErr', f
 
 uis.directive('uiSelectHeader', function(){
   return {
-    template: '<div class="ui-select-header" ng-transclude></div>',
+    template: '<li class="ui-select-header" ng-transclude></li>',
     restrict: 'EA',
     transclude: true,
     replace: true
   };
 });
 uis.directive('uiSelectFooter', function(){
   return {
-    template: '<div class="ui-select-footer" ng-transclude></div>',
+    template: '<li class="ui-select-footer" ng-transclude></li>',
     restrict: 'EA',
     transclude: true,
     replace: true