diff --git a/awx/ui/client/lib/angular-scheduler/lib/angular-scheduler.js b/awx/ui/client/lib/angular-scheduler/lib/angular-scheduler.js
index 7ed581a09f..4f4d49e358 100644
--- a/awx/ui/client/lib/angular-scheduler/lib/angular-scheduler.js
+++ b/awx/ui/client/lib/angular-scheduler/lib/angular-scheduler.js
@@ -108,6 +108,8 @@ angular.module('AngularScheduler', ['underscore'])
                     scope.schedulerEnd = scope.endOptions[0];
                 }
                 scope.sheduler_frequency_error = false;
+
+                scope.$emit("updateSchedulerSelects");
             };
 
             scope.showCalendar = function(fld) {
diff --git a/awx/ui/client/src/scheduler/repeatFrequencyOptions.block.less b/awx/ui/client/src/scheduler/repeatFrequencyOptions.block.less
index 956ad9e3ce..703b1d719d 100644
--- a/awx/ui/client/src/scheduler/repeatFrequencyOptions.block.less
+++ b/awx/ui/client/src/scheduler/repeatFrequencyOptions.block.less
@@ -115,7 +115,8 @@
     margin-top: 2px;
 }
 
-.RepeatFrequencyOptions-spacedSelect {
+.RepeatFrequencyOptions-spacedSelect,
+.RepeatFrequencyOptions-spacedSelect ~ .select2 {
     margin-bottom: 10px;
 }
 
@@ -137,3 +138,25 @@
     flex: initial;
     width: 100%;
 }
+
+.RepeatFrequencyOptions-nameBorderErrorFix {
+    border-color: #ff5850 !important;
+}
+
+.RepeatFrequencyOptions-inputGroup {
+    display: flex;
+    justify-content: space-between;
+}
+
+.RepeatFrequencyOptions-inputGroup--thirds > .select2 {
+    width: ~"calc(33% - 3px)" !important;
+}
+
+.RepeatFrequencyOptions-inputGroup--halves > .select2 {
+    width: ~"calc(50% - 3px)" !important;
+}
+
+.RepeatFrequencyOptions-inputGroup--halvesWithNumber > .select2 {
+    width: ~"calc(50% - 3px)" !important;
+    margin-right: 7px;
+}
diff --git a/awx/ui/client/src/scheduler/schedulerAdd.controller.js b/awx/ui/client/src/scheduler/schedulerAdd.controller.js
index a6eb3e12be..a37362b6b4 100644
--- a/awx/ui/client/src/scheduler/schedulerAdd.controller.js
+++ b/awx/ui/client/src/scheduler/schedulerAdd.controller.js
@@ -1,4 +1,4 @@
-export default ['$compile', '$state', '$stateParams', 'AddSchedule', 'Wait', '$scope', '$rootScope', function($compile, $state, $stateParams, AddSchedule, Wait, $scope, $rootScope) {
+export default ['$compile', '$state', '$stateParams', 'AddSchedule', 'Wait', '$scope', '$rootScope', 'CreateSelect2', function($compile, $state, $stateParams, AddSchedule, Wait, $scope, $rootScope, CreateSelect2) {
     $scope.$on("ScheduleFormCreated", function(e, scope) {
         $scope.hideForm = false;
         $scope = angular.extend($scope, scope);
@@ -43,10 +43,69 @@ export default ['$compile', '$state', '$stateParams', 'AddSchedule', 'Wait', '$s
 
     $scope.formCancel = function() {
         $state.go("^");
-    }
+    };
 
     AddSchedule({
         scope: $scope,
         callback: 'SchedulesRefresh'
     });
+
+    var callSelect2 = function() {
+        CreateSelect2({
+            element: '#schedulerTimeZone',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#schedulerFrequency',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#monthlyWeekDay',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#monthlyOccurrence',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#monthlyOccurrence',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#yearlyMonth',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#yearlyWeekDay',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#yearlyOccurrence',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#yearlyOtherMonth',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#schedulerEnd',
+            multiple: false
+        });
+    };
+
+    $scope.$on("updateSchedulerSelects", function() {
+        callSelect2();
+        console.log("select2 is called");
+    });
+
+    callSelect2();
 }];
diff --git a/awx/ui/client/src/scheduler/schedulerEdit.controller.js b/awx/ui/client/src/scheduler/schedulerEdit.controller.js
index 82d9fa26e4..96646bfff0 100644
--- a/awx/ui/client/src/scheduler/schedulerEdit.controller.js
+++ b/awx/ui/client/src/scheduler/schedulerEdit.controller.js
@@ -1,4 +1,4 @@
-export default ['$compile', '$state', '$stateParams', 'EditSchedule', 'Wait', '$scope', '$rootScope', function($compile, $state, $stateParams, EditSchedule, Wait, $scope, $rootScope) {
+export default ['$compile', '$state', '$stateParams', 'EditSchedule', 'Wait', '$scope', '$rootScope', 'CreateSelect2', function($compile, $state, $stateParams, EditSchedule, Wait, $scope, $rootScope, CreateSelect2) {
     $scope.$on("ScheduleFormCreated", function(e, scope) {
         $scope.hideForm = false;
         $scope = angular.extend($scope, scope);
@@ -53,4 +53,63 @@ export default ['$compile', '$state', '$stateParams', 'EditSchedule', 'Wait', '$
         id: parseInt($stateParams.schedule_id),
         callback: 'SchedulesRefresh'
     });
+
+    var callSelect2 = function() {
+        CreateSelect2({
+            element: '#schedulerTimeZone',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#schedulerFrequency',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#monthlyWeekDay',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#monthlyOccurrence',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#monthlyOccurrence',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#yearlyMonth',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#yearlyWeekDay',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#yearlyOccurrence',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#yearlyOtherMonth',
+            multiple: false
+        });
+
+        CreateSelect2({
+            element: '#schedulerEnd',
+            multiple: false
+        });
+    };
+
+    $scope.$on("updateSchedulerSelects", function() {
+        callSelect2();
+        console.log("select2 is called");
+    });
+
+    callSelect2();
 }];