From 7722f0ca0835b1a9063ddade91bceeaca60cb929 Mon Sep 17 00:00:00 2001
From: mabashian <mabashia@redhat.com>
Date: Thu, 4 Apr 2019 10:16:06 -0400
Subject: [PATCH] Prevent on/off toggles from getting inadvertently trigged by
 enter key presses

---
 .../instance-groups/instances/instances-list.partial.html | 2 ++
 .../client/src/inventories-hosts/hosts/hosts.partial.html | 4 ++--
 .../client/src/job-submission/job-submission.partial.html | 4 ++--
 awx/ui/client/src/partials/survey-maker-modal.html        | 4 ++--
 awx/ui/client/src/shared/form-generator.js                | 8 ++++----
 awx/ui/client/src/shared/generator-helpers.js             | 4 ++--
 .../steps/other-prompts/prompt-other-prompts.partial.html | 4 ++--
 7 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/awx/ui/client/src/instance-groups/instances/instances-list.partial.html b/awx/ui/client/src/instance-groups/instances/instances-list.partial.html
index 197f15050d..6d692cc6e5 100644
--- a/awx/ui/client/src/instance-groups/instances/instances-list.partial.html
+++ b/awx/ui/client/src/instance-groups/instances/instances-list.partial.html
@@ -49,12 +49,14 @@
                         ng-class="{'is-on': instance.enabled,
                             'ScheduleToggle--disabled': vm.rowAction.toggle._disabled}">
                         <button ng-show="instance.enabled"
+                            type="button"
                             class="ScheduleToggle-switch is-on ng-hide"
                             ng-click="vm.toggle(instance)"
                             ng-disabled="vm.rowAction.toggle._disabled">
                             {{:: vm.strings.get('ON') }}
                         </button>
                         <button ng-show="!instance.enabled"
+                            type="button"
                             class="ScheduleToggle-switch"
                             ng-click="vm.toggle(instance)"
                             ng-disabled="vm.rowAction.toggle._disabled">
diff --git a/awx/ui/client/src/inventories-hosts/hosts/hosts.partial.html b/awx/ui/client/src/inventories-hosts/hosts/hosts.partial.html
index 1b1bd7ed4c..2c1f3b0747 100644
--- a/awx/ui/client/src/inventories-hosts/hosts/hosts.partial.html
+++ b/awx/ui/client/src/inventories-hosts/hosts/hosts.partial.html
@@ -52,8 +52,8 @@
                             <div></div>
                             <div class="List-tableCell toggleHost-column List-staticColumn--toggle">
                                 <div class="ScheduleToggle" ng-class="{'is-on': host.enabled, 'ScheduleToggle--disabled': host.has_inventory_sources}" aw-tool-tip="{{strings.get('hostList.DISABLED_TOGGLE_TOOLTIP')}}" data-placement="right" data-tip-watch="undefined">
-                                    <button ng-disabled="host.has_inventory_sources" ng-show="host.enabled" class="ScheduleToggle-switch is-on" ng-click="toggleHost($event, host)" translate>ON</button>
-                                    <button ng-disabled="host.has_inventory_sources" ng-show="!host.enabled" class="ScheduleToggle-switch" ng-click="toggleHost($event, host)" translate>OFF</button>
+                                    <button type="button" ng-disabled="host.has_inventory_sources" ng-show="host.enabled" class="ScheduleToggle-switch is-on" ng-click="toggleHost($event, host)" translate>ON</button>
+                                    <button type="button" ng-disabled="host.has_inventory_sources" ng-show="!host.enabled" class="ScheduleToggle-switch" ng-click="toggleHost($event, host)" translate>OFF</button>
                                 </div>
                             </div>
                             <div class="List-tableCell active_failures-column status-column List-staticColumn--smallStatus">
diff --git a/awx/ui/client/src/job-submission/job-submission.partial.html b/awx/ui/client/src/job-submission/job-submission.partial.html
index 5e8dfc890e..82c699ef3d 100644
--- a/awx/ui/client/src/job-submission/job-submission.partial.html
+++ b/awx/ui/client/src/job-submission/job-submission.partial.html
@@ -264,9 +264,9 @@
                         </label>
                         <div>
                             <div class="ScheduleToggle" ng-class="{'is-on': other_prompt_data.diff_mode}" aw-tool-tip="" data-placement="top" data-original-title="" title="">
-                                <button ng-show="other_prompt_data.diff_mode" class="ScheduleToggle-switch is-on" ng-click="toggleForm('diff_mode')"
+                                <button type="button" ng-show="other_prompt_data.diff_mode" class="ScheduleToggle-switch is-on" ng-click="toggleForm('diff_mode')"
                                 translate>ON</button>
-                                <button ng-show="!other_prompt_data.diff_mode" class="ScheduleToggle-switch ng-hide" ng-click="toggleForm('diff_mode')" translate>OFF</button>
+                                <button type="button" ng-show="!other_prompt_data.diff_mode" class="ScheduleToggle-switch ng-hide" ng-click="toggleForm('diff_mode')" translate>OFF</button>
                             </div>
                         </div>
                     </div>
diff --git a/awx/ui/client/src/partials/survey-maker-modal.html b/awx/ui/client/src/partials/survey-maker-modal.html
index 476af0bc30..832496c4e6 100644
--- a/awx/ui/client/src/partials/survey-maker-modal.html
+++ b/awx/ui/client/src/partials/survey-maker-modal.html
@@ -23,8 +23,8 @@
         <div class="SurveyMaker-title">
             <div class="SurveyMaker-titleText">{{name || "New Job Template"}}<div class="SurveyMaker-titleLockup"></div><span translate>SURVEY</span></div>
             <div class="ScheduleToggle" ng-class="{'is-on': survey_enabled}" aw-tool-tip="surveyEnabledTooltip" data-container="#survey-modal-dialog" data-placement="right" data-tip-watch="surveyEnabledTooltip">
-                <button ng-show="survey_enabled" class="ScheduleToggle-switch is-on" ng-click="toggleSurveyEnabled()" translate>ON</button>
-                <button ng-show="!survey_enabled" class="ScheduleToggle-switch" ng-click="toggleSurveyEnabled()" translate>OFF</button>
+                <button type="button" ng-show="survey_enabled" class="ScheduleToggle-switch is-on" ng-click="toggleSurveyEnabled()" translate>ON</button>
+                <button type="button" ng-show="!survey_enabled" class="ScheduleToggle-switch" ng-click="toggleSurveyEnabled()" translate>OFF</button>
             </div>
         </div>
         <div class="SurveyMaker-close">
diff --git a/awx/ui/client/src/shared/form-generator.js b/awx/ui/client/src/shared/form-generator.js
index 5387fca4f5..fc44a61a4b 100644
--- a/awx/ui/client/src/shared/form-generator.js
+++ b/awx/ui/client/src/shared/form-generator.js
@@ -518,11 +518,11 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
                     html += "\"><div class='ScheduleToggle' ng-class='{\"is-on\": " + form.iterator + ".";
                     html += (field.flag) ? field.flag : "enabled";
                     html += (field.ngDisabled) ? ', "ScheduleToggle--disabled": ' + field.ngDisabled : '';
-                    html += "\}' aw-tool-tip='" + field.awToolTip + "' data-placement='" + field.dataPlacement + "' data-tip-watch='" + field.dataTipWatch + "'><button ng-show='" + form.iterator + "." ;
+                    html += "\}' aw-tool-tip='" + field.awToolTip + "' data-placement='" + field.dataPlacement + "' data-tip-watch='" + field.dataTipWatch + "'><button type='button' ng-show='" + form.iterator + "." ;
                     html += (field.flag) ? field.flag : 'enabled';
                     html += "' ";
                     html += (field.ngDisabled) ? `ng-disabled="${field.ngDisabled}" ` : "";
-                    html += " class='ScheduleToggle-switch is-on' ng-click='" + field.ngClick + "' translate>" + i18n._("ON") + "</button><button ng-show='!" + form.iterator + "." ;
+                    html += " class='ScheduleToggle-switch is-on' ng-click='" + field.ngClick + "' translate>" + i18n._("ON") + "</button><button type='button' ng-show='!" + form.iterator + "." ;
                     html += (field.flag) ? field.flag : "enabled";
                     html += "' ";
                     html += (field.ngDisabled) ? `ng-disabled="${field.ngDisabled}" ` : "";
@@ -745,9 +745,9 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
                         html += `<div class="ScheduleToggle" ng-class="{'is-on': ${field.toggleSource}, 'ScheduleToggle--disabled': ${field.ngDisabled}}" aw-tool-tip="" `;
                         html += (field.ngShow) ? "ng-show=\"" + field.ngShow + "\" " : "";
                         html += `data-placement="top">`;
-                        html += `<button ng-show="${field.toggleSource}" class="ScheduleToggle-switch is-on" ng-click="toggleForm('${field.toggleSource}')"
+                        html += `<button type="button" ng-show="${field.toggleSource}" class="ScheduleToggle-switch is-on" ng-click="toggleForm('${field.toggleSource}')"
                                 ng-disabled="${field.ngDisabled}" translate>${i18n._("ON")}</button>
-                            <button ng-show="!${field.toggleSource}" class="ScheduleToggle-switch" ng-click="toggleForm('${field.toggleSource}')"
+                            <button type="button" ng-show="!${field.toggleSource}" class="ScheduleToggle-switch" ng-click="toggleForm('${field.toggleSource}')"
                                 ng-disabled="${field.ngDisabled}" translate>${i18n._("OFF")}</button>
                         </div>`;
                     }
diff --git a/awx/ui/client/src/shared/generator-helpers.js b/awx/ui/client/src/shared/generator-helpers.js
index f35eb9d1ff..af7f035001 100644
--- a/awx/ui/client/src/shared/generator-helpers.js
+++ b/awx/ui/client/src/shared/generator-helpers.js
@@ -533,11 +533,11 @@ angular.module('GeneratorHelpers', [systemStatus.name])
                 html += "\"><div class='ScheduleToggle' ng-class='{\"is-on\": " + list.iterator + ".";
                 html += (field.flag) ? field.flag : "enabled";
                 html += (field.ngDisabled) ? ', "ScheduleToggle--disabled": ' + field.ngDisabled : '';
-                html += "\}' aw-tool-tip='" + field.awToolTip + "' data-placement='" + field.dataPlacement + "' data-tip-watch='" + field.dataTipWatch + "'><button ";
+                html += "\}' aw-tool-tip='" + field.awToolTip + "' data-placement='" + field.dataPlacement + "' data-tip-watch='" + field.dataTipWatch + "'><button type='button'";
                 html += (field.ngDisabled) ? `ng-disabled="${field.ngDisabled}" ` : "";
                 html += "ng-show='" + list.iterator + "." ;
                 html += (field.flag) ? field.flag : 'enabled';
-                html += "' class='ScheduleToggle-switch is-on' ng-click='" + field.ngClick + "'>" + i18n._("ON") + "</button><button ";
+                html += "' class='ScheduleToggle-switch is-on' ng-click='" + field.ngClick + "'>" + i18n._("ON") + "</button><button type='button'";
                 html += (field.ngDisabled) ? `ng-disabled="${field.ngDisabled}" ` : "";
                 html += "ng-show='!" + list.iterator + "." ;
                 html += (field.flag) ? field.flag : "enabled";
diff --git a/awx/ui/client/src/templates/prompt/steps/other-prompts/prompt-other-prompts.partial.html b/awx/ui/client/src/templates/prompt/steps/other-prompts/prompt-other-prompts.partial.html
index a3160c5b00..cfb08fa7b0 100644
--- a/awx/ui/client/src/templates/prompt/steps/other-prompts/prompt-other-prompts.partial.html
+++ b/awx/ui/client/src/templates/prompt/steps/other-prompts/prompt-other-prompts.partial.html
@@ -112,8 +112,8 @@
         </label>
         <div>
             <div class="ScheduleToggle" ng-class="{'is-on': promptData.prompts.diffMode.value}" aw-tool-tip="" data-placement="top" data-original-title="" title="" ng-click="vm.toggleDiff()">
-                <button ng-show="promptData.prompts.diffMode.value" class="ScheduleToggle-switch is-on" ng-disabled="readOnlyPrompts">{{:: vm.strings.get('ON') }}</button>
-                <button ng-show="!promptData.prompts.diffMode.value" class="ScheduleToggle-switch ng-hide" ng-disabled="readOnlyPrompts">{{:: vm.strings.get('OFF') }}</button>
+                <button type="button" ng-show="promptData.prompts.diffMode.value" class="ScheduleToggle-switch is-on" ng-disabled="readOnlyPrompts">{{:: vm.strings.get('ON') }}</button>
+                <button type="button" ng-show="!promptData.prompts.diffMode.value" class="ScheduleToggle-switch ng-hide" ng-disabled="readOnlyPrompts">{{:: vm.strings.get('OFF') }}</button>
             </div>
         </div>
     </div>