diff --git a/awx/ui/client/features/credentials/external-test-modal.partial.html b/awx/ui/client/features/credentials/external-test-modal.partial.html
index c44ef4487e..57ba47bc3f 100644
--- a/awx/ui/client/features/credentials/external-test-modal.partial.html
+++ b/awx/ui/client/features/credentials/external-test-modal.partial.html
@@ -2,11 +2,18 @@
     <at-form state="vm.form" autocomplete="off" id="external_test_form">
         <at-input-group col="12" tab="20" state="vm.form.inputs" form-id="external_test"></at-input-group>
         <at-action-group col="12" pos="right">
-            <at-action-button variant="tertiary" ng-click="vm.onClose()">
-		{{::vm.strings.get('CLOSE')}}
+            <at-action-button
+                variant="tertiary"
+                ng-click="vm.onClose()"
+            >
+                {{::vm.strings.get('CLOSE')}}
             </at-action-button>
-            <at-action-button variant="primary" ng-click="vm.onSubmit()">
-		{{::vm.strings.get('RUN')}}
+            <at-action-button
+                variant="primary"
+                ng-click="vm.onSubmit()"
+                ng-disabled="!vm.form.isValid || vm.form.disabled"
+            >
+                {{::vm.strings.get('RUN')}}
             </at-action-button>
         </at-action-group>
     </at-form>
diff --git a/awx/ui/client/features/credentials/input-source-lookup.partial.html b/awx/ui/client/features/credentials/input-source-lookup.partial.html
index 336a8e62c0..b7c420fcf0 100644
--- a/awx/ui/client/features/credentials/input-source-lookup.partial.html
+++ b/awx/ui/client/features/credentials/input-source-lookup.partial.html
@@ -37,6 +37,7 @@
             <at-action-button
                 variant="secondary"
                 ng-click="vm.onTest()"
+                ng-disabled="!vm.form.isValid || vm.form.disabled"
                 ng-show="vm.tabs.metadata._active"
             >
                 {{::vm.strings.get('TEST')}}
@@ -50,6 +51,7 @@
             <at-action-button
                 variant="primary"
                 ng-click="vm.onNext()"
+                ng-disabled="!vm.selectedId"
                 ng-show="vm.tabs.credential._active"
             >
                 {{::vm.strings.get('NEXT')}}
@@ -57,6 +59,7 @@
             <at-action-button
                 variant="primary"
                 ng-click="vm.onSelect()"
+                ng-disabled="!vm.form.isValid || vm.form.disabled"
                 ng-show="vm.tabs.metadata._active"
             >
                 {{::vm.strings.get('OK')}}
diff --git a/awx/ui/client/lib/components/action/action-button.component.js b/awx/ui/client/lib/components/action/action-button.component.js
deleted file mode 100644
index d77bf218db..0000000000
--- a/awx/ui/client/lib/components/action/action-button.component.js
+++ /dev/null
@@ -1,33 +0,0 @@
-const templateUrl = require('~components/action/action-button.partial.html');
-
-function ActionButtonController () {
-    const vm = this || {};
-    vm.$onInit = () => {
-        const { variant } = vm;
-
-        if (variant === 'primary') {
-            vm.color = 'success';
-            vm.fill = '';
-        }
-
-        if (variant === 'secondary') {
-            vm.color = 'info';
-            vm.fill = '';
-        }
-
-        if (variant === 'tertiary') {
-            vm.color = 'default';
-            vm.fill = 'Hollow';
-        }
-    };
-}
-
-export default {
-    templateUrl,
-    controller: ActionButtonController,
-    controllerAs: 'vm',
-    transclude: true,
-    bindings: {
-        variant: '@',
-    },
-};
diff --git a/awx/ui/client/lib/components/action/action-button.directive.js b/awx/ui/client/lib/components/action/action-button.directive.js
new file mode 100644
index 0000000000..733faa6f97
--- /dev/null
+++ b/awx/ui/client/lib/components/action/action-button.directive.js
@@ -0,0 +1,48 @@
+const templateUrl = require('~components/action/action-button.partial.html');
+
+function link (scope, element, attrs, controllers) {
+    const [actionButtonController] = controllers;
+
+    actionButtonController.init(scope);
+}
+
+function ActionButtonController () {
+    const vm = this || {};
+
+    vm.init = (scope) => {
+        const { variant } = scope;
+
+        if (variant === 'primary') {
+            vm.color = 'success';
+            vm.fill = '';
+        }
+
+        if (variant === 'secondary') {
+            vm.color = 'info';
+            vm.fill = '';
+        }
+
+        if (variant === 'tertiary') {
+            vm.color = 'default';
+            vm.fill = 'Hollow';
+        }
+    };
+}
+
+function atActionButton () {
+    return {
+        restrict: 'E',
+        transclude: true,
+        replace: true,
+        templateUrl,
+        require: ['atActionButton'],
+        controller: ActionButtonController,
+        controllerAs: 'vm',
+        link,
+        scope: {
+            variant: '@',
+        }
+    };
+}
+
+export default atActionButton;
diff --git a/awx/ui/client/lib/components/form/form.directive.js b/awx/ui/client/lib/components/form/form.directive.js
index a270b0835e..e6bb782493 100644
--- a/awx/ui/client/lib/components/form/form.directive.js
+++ b/awx/ui/client/lib/components/form/form.directive.js
@@ -202,7 +202,10 @@ function AtFormController (eventService, strings) {
 
         if (isValid !== vm.state.isValid) {
             vm.state.isValid = isValid;
-            scope.state.isValid = vm.state.isValid;
+        }
+
+        if (isValid !== scope.state.isValid) {
+            scope.state.isValid = isValid;
         }
     };
 
diff --git a/awx/ui/client/lib/components/index.js b/awx/ui/client/lib/components/index.js
index b9dca8673c..666fccf480 100644
--- a/awx/ui/client/lib/components/index.js
+++ b/awx/ui/client/lib/components/index.js
@@ -1,7 +1,7 @@
 import atLibServices from '~services';
 
 import actionGroup from '~components/action/action-group.directive';
-import actionButton from '~components/action/action-button.component';
+import actionButton from '~components/action/action-button.directive';
 import divider from '~components/utility/divider.directive';
 import dynamicSelect from '~components/input/dynamic-select.directive';
 import easyModal from '~components/easy-modal/easy-modal.component';
@@ -56,7 +56,7 @@ angular
         atCodeMirror
     ])
     .directive('atActionGroup', actionGroup)
-    .component('atActionButton', actionButton)
+    .directive('atActionButton', actionButton)
     .directive('atDivider', divider)
     .directive('atDynamicSelect', dynamicSelect)
     .component('atEasyModal', easyModal)