diff --git a/awx/ui/client/src/job-submission/job-submission.block.less b/awx/ui/client/src/job-submission/job-submission.block.less
index 3ea394c1e0..15d93c95cb 100644
--- a/awx/ui/client/src/job-submission/job-submission.block.less
+++ b/awx/ui/client/src/job-submission/job-submission.block.less
@@ -216,5 +216,5 @@
     margin-bottom: 15px;
 }
 .JobSubmission-passwordButton {
-    padding: 7px 15px!important;
+    padding: 5px 13px!important;
 }
diff --git a/awx/ui/client/src/job-submission/job-submission.controller.js b/awx/ui/client/src/job-submission/job-submission.controller.js
index 4f9c28ea9a..b25e463ee9 100644
--- a/awx/ui/client/src/job-submission/job-submission.controller.js
+++ b/awx/ui/client/src/job-submission/job-submission.controller.js
@@ -174,6 +174,7 @@ export default
 
                     if($scope.ask_variables_on_launch) {
                         $scope.variables = (data.defaults && data.defaults.extra_vars) ? data.defaults.extra_vars : "---";
+                        $scope.other_prompt_data.parseType = 'yaml';
                         $scope.parseType = 'yaml';
                     }
 
@@ -258,7 +259,7 @@ export default
                 }
                 else if(step === "otherprompts") {
                     $scope.otherPromptsTabEnabled = true;
-                    if(!$scope.extra_vars_code_mirror_loaded) {
+                    if($scope.ask_variables_on_launch && !$scope.extra_vars_code_mirror_loaded) {
                         ParseTypeChange({
                             scope: $scope,
                             field_id: 'job_launch_variables'
@@ -514,5 +515,14 @@ export default
                 }
             };
 
+            $scope.updateParseType = function() {
+                // This is what the ParseTypeChange factory is expecting
+                // It shares the same scope with this directive and will
+                // pull the new value of parseType out to determine which
+                // direction to convert the extra vars
+                $scope.parseType = $scope.other_prompt_data.parseType;
+                $scope.parseTypeChange();
+            };
+
         }
     ];
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 39299a01a9..76e17adc58 100644
--- a/awx/ui/client/src/job-submission/job-submission.partial.html
+++ b/awx/ui/client/src/job-submission/job-submission.partial.html
@@ -52,41 +52,53 @@
                                 <label for="ssh_password">
                                     <span class="Form-inputLabel prepend-asterisk"> Password</span>
                                 </label>
-                                <div>
-                                    <input type="password" ng-model="passwords.ssh_password" ng-keydown="keydown($event)" name="ssh_password" class="password-field form-control input-sm" required>
-                                    <div class="error" ng-show="forms.credentialpasswords.ssh_password.$dirty && forms.credentialpasswords.ssh_password.$error.required">Please enter a password.</div>
-                                    <div class="error api-error" ng-bind="ssh_password_api_error"></div>
+                                <div class="input-group">
+                                    <span class="input-group-btn">
+                                        <button class="btn btn-default show_input_button JobSubmission-passwordButton" id="job-submission-ssh-password_show_input_button" aw-tool-tip="Toggle the display of plaintext." aw-tip-placement="top" ng-click="togglePassword('#job-submission-ssh-password')" data-original-title="" title="">Show</button>
+                                    </span>
+                                    <input id="job-submission-ssh-password" type="password" ng-model="passwords.ssh_password" ng-keydown="keydown($event)" name="ssh_password" class="password-field form-control input-sm Form-textInput" required>
                                 </div>
+                                <div class="error" ng-show="forms.credentialpasswords.ssh_password.$dirty && forms.credentialpasswords.ssh_password.$error.required">Please enter a password.</div>
+                                <div class="error api-error" ng-bind="ssh_password_api_error"></div>
                             </div>
                             <div class="form-group Form-formGroup Form-formGroup--singleColumn" ng-if="ssh_key_unlock_required">
                                 <label for="ssh_key_unlock">
                                     <span class="Form-inputLabel prepend-asterisk"> Private Key Passphrase</span>
                                 </label>
-                                <div>
-                                    <input type="password" ng-model="passwords.ssh_key_unlock" ng-keydown="keydown($event)" name="ssh_key_unlock" class="password-field form-control input-sm" required>
-                                    <div class="error" ng-show="forms.credentialpasswords.ssh_key_unlock.$dirty && forms.credentialpasswords.ssh_key_unlock.$error.required">Please enter a password.</div>
-                                    <div class="error api-error" ng-bind="ssh_key_unlock_api_error"></div>
+                                <div class="input-group">
+                                    <span class="input-group-btn">
+                                        <button class="btn btn-default show_input_button JobSubmission-passwordButton" id="job-submission-ssh-key-unlock_show_input_button" aw-tool-tip="Toggle the display of plaintext." aw-tip-placement="top" ng-click="togglePassword('#job-submission-ssh-key-unlock')" data-original-title="" title="">Show</button>
+                                    </span>
+                                    <input id="job-submission-ssh-key-unlock" type="password" ng-model="passwords.ssh_key_unlock" ng-keydown="keydown($event)" name="ssh_key_unlock" class="password-field form-control input-sm Form-textInput" required>
                                 </div>
+                                <div class="error" ng-show="forms.credentialpasswords.ssh_key_unlock.$dirty && forms.credentialpasswords.ssh_key_unlock.$error.required">Please enter a password.</div>
+                                <div class="error api-error" ng-bind="ssh_key_unlock_api_error"></div>
                             </div>
                             <div class="form-group Form-formGroup Form-formGroup--singleColumn" ng-if="become_password_required">
                                 <label for="become_password">
                                     <span class="Form-inputLabel prepend-asterisk"> Privilege Escalation Password</span>
                                 </label>
-                                <div>
-                                    <input type="password" ng-model="passwords.become_password" ng-keydown="keydown($event)" name="become_password" class="password-field form-control input-sm" required>
-                                    <div class="error" ng-show="forms.credentialpasswords.become_password.$dirty && forms.credentialpasswords.become_password.$error.required">Please enter a password.</div>
-                                    <div class="error api-error" ng-bind="become_password_api_error"></div>
+                                <div class="input-group">
+                                    <span class="input-group-btn">
+                                        <button class="btn btn-default show_input_button JobSubmission-passwordButton" id="job-submission-become-password_show_input_button" aw-tool-tip="Toggle the display of plaintext." aw-tip-placement="top" ng-click="togglePassword('#job-submission-become-password')" data-original-title="" title="">Show</button>
+                                    </span>
+                                    <input id="job-submission-become-password" type="password" ng-model="passwords.become_password" ng-keydown="keydown($event)" name="become_password" class="password-field form-control input-sm Form-textInput" required>
                                 </div>
+                                <div class="error" ng-show="forms.credentialpasswords.become_password.$dirty && forms.credentialpasswords.become_password.$error.required">Please enter a password.</div>
+                                <div class="error api-error" ng-bind="become_password_api_error"></div>
                             </div>
                             <div class="form-group Form-formGroup Form-formGroup--singleColumn" ng-if="vault_password_required">
                                 <label for="vault_password">
                                     <span class="Form-inputLabel prepend-asterisk"> Vault Password</span>
                                 </label>
-                                <div>
-                                    <input type="password" ng-model="passwords.vault_password" ng-keydown="keydown($event)" name="vault_password" class="password-field form-control input-sm" required>
-                                    <div class="error" ng-show="forms.credentialpasswords.vault_password.$dirty && forms.credentialpasswords.vault_password.$error.required">Please enter a password.</div>
-                                    <div class="error api-error" ng-bind="vault_password_api_error"></div>
+                                <div class="input-group">
+                                    <span class="input-group-btn">
+                                        <button class="btn btn-default show_input_button JobSubmission-passwordButton" id="job-submission-vault-password_show_input_button" aw-tool-tip="Toggle the display of plaintext." aw-tip-placement="top" ng-click="togglePassword('#job-submission-vault-password')" data-original-title="" title="">Show</button>
+                                    </span>
+                                    <input id="job-submission-vault-password" type="password" ng-model="passwords.vault_password" ng-keydown="keydown($event)" name="vault_password" class="password-field form-control input-sm Form-textInput" required>
                                 </div>
+                                <div class="error" ng-show="forms.credentialpasswords.vault_password.$dirty && forms.credentialpasswords.vault_password.$error.required">Please enter a password.</div>
+                                <div class="error api-error" ng-bind="vault_password_api_error"></div>
                             </div>
                         </form>
                     </div>
@@ -101,9 +113,9 @@
                                 <i class="fa fa-question-circle"></i>
                             </a>
                             <div class="parse-selection" id="job_launch_variables_parse_type">
-                                <input type="radio" ng-model="parseType" value="yaml" ng-change="parseTypeChange()">
+                                <input type="radio" ng-model="other_prompt_data.parseType" value="yaml" ng-change="updateParseType()">
                                 <span class="parse-label">YAML</span>
-                                <input type="radio" ng-model="parseType" value="json" ng-change="parseTypeChange()">
+                                <input type="radio" ng-model="other_prompt_data.parseType" value="json" ng-change="updateParseType()">
                                 <span class="parse-label">JSON</span>
                             </div>
                         </label>
@@ -152,12 +164,12 @@
                             <i ng-bind="question.question_description"></i>
                         </div>
                         <div ng-if="question.type === 'text'">
-                            <input type="text" id="survey_question_{{$index}}" ng-model="question.model" name="survey_question_{{$index}}" ng-minlength="question.minlength" ng-maxlength="question.maxlength" class="form-control" ng-required="question.required">
+                            <input type="text" id="survey_question_{{$index}}" ng-model="question.model" name="survey_question_{{$index}}" ng-minlength="question.minlength" ng-maxlength="question.maxlength" class="form-control Form-textInput" ng-required="question.required">
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$dirty && forms.survey.survey_question_{{$index}}.$error.required">Please enter an answer.</div>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$error.minlength || forms.survey.survey_question_{{$index}}.$error.maxlength">Please enter an answer between {{question.minlength}} to {{question.maxlength}} characters long.</div>
                         </div>
                         <div ng-if="question.type === 'textarea'">
-                            <textarea id="survey_question_{{$index}}" name="survey_question_{{$index}}" ng-model="question.model" ng-minlength="question.minlength" ng-maxlength="question.maxlength" class="form-control final" ng-required="question.required" rows="3"></textarea>
+                            <textarea id="survey_question_{{$index}}" name="survey_question_{{$index}}" ng-model="question.model" ng-minlength="question.minlength" ng-maxlength="question.maxlength" class="form-control final Form-textInput" ng-required="question.required" rows="3"></textarea>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$dirty && forms.survey.survey_question_{{$index}}.$error.required">Please enter an answer.</div>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$error.minlength || forms.survey.survey_question_{{$index}}.$error.maxlength">Please enter an answer between {{question.minlength}} to {{question.maxlength}} characters long.</div>
                         </div>
@@ -166,19 +178,19 @@
                                 <span class="input-group-btn">
                                     <button class="btn btn-default show_input_button JobSubmission-passwordButton" id="survey_question_{{$index}}_show_input_button" aw-tool-tip="Toggle the display of plaintext." aw-tip-placement="top" ng-click="togglePassword('#survey_question_' + $index)" data-original-title="" title="">Show</button>
                                 </span>
-                                <input id="survey_question_{{$index}}" type="password" ng-model="question.model" name="survey_question_{{$index}}" ng-required="question.required" ng-minlength="question.minlength" ng-maxlength="question.maxlength" class="form-control ng-pristine ng-valid-api-error ng-invalid" autocomplete="false">
+                                <input id="survey_question_{{$index}}" type="password" ng-model="question.model" name="survey_question_{{$index}}" ng-required="question.required" ng-minlength="question.minlength" ng-maxlength="question.maxlength" class="form-control Form-textInput" autocomplete="false">
                             </div>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$dirty && forms.survey.survey_question_{{$index}}.$error.required">Please enter an answer.</div>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$error.minlength || forms.survey.survey_question_{{$index}}.$error.maxlength">Please enter an answer between {{question.minlength}} to {{question.maxlength}} characters long.</div>
                         </div>
                         <div ng-if="question.type === 'integer'">
-                            <input type="number" id="survey_question_{{$index}}" ng-model="question.model" class="form-control" name="survey_question_{{$index}}" ng-required="question.required" integer aw-min="question.minValue" aw-max="question.maxValue"/>
+                            <input type="number" id="survey_question_{{$index}}" ng-model="question.model" class="form-control Form-textInput" name="survey_question_{{$index}}" ng-required="question.required" integer aw-min="question.minValue" aw-max="question.maxValue"/>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$dirty && forms.survey.survey_question_{{$index}}.$error.required">Please enter an answer.</div>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$error.number || forms.survey.survey_question_{{$index}}.$error.integer" >Please enter an answer that is a valid integer.</div>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$error.awMin || forms.survey.survey_question_{{$index}}.$error.awMax">Please enter an answer between {{question.minValue}} and {{question.maxValue}}.</div>
                         </div>
                         <div ng-if="question.type === 'float'">
-                            <input type="number" id="survey_question_{{$index}}" ng-model="question.model" class="form-control" name="survey_question_{{$index}}" ng-required="question.required" smart-float aw-min="question.minValue" aw-max="question.maxValue"/>
+                            <input type="number" id="survey_question_{{$index}}" ng-model="question.model" class="form-control Form-textInput" name="survey_question_{{$index}}" ng-required="question.required" smart-float aw-min="question.minValue" aw-max="question.maxValue"/>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$dirty && forms.survey.survey_question_{{$index}}.$error.required">Please enter an answer.</div>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$error.number || forms.survey.survey_question_{{$index}}.$error.float">Please enter an answer that is a decimal number.</div>
                             <div class="error survey_error" ng-show="forms.survey.survey_question_{{$index}}.$error.awMin || forms.survey.survey_question_{{$index}}.$error.awMax">Please enter an answer between {{question.minValue}} and {{question.maxValue}}.</div>