diff --git a/awx/ui/static/js/forms/SurveyQuestion.js b/awx/ui/static/js/forms/SurveyQuestion.js
index b798b94cb3..5ce04d99bc 100644
--- a/awx/ui/static/js/forms/SurveyQuestion.js
+++ b/awx/ui/static/js/forms/SurveyQuestion.js
@@ -41,9 +41,30 @@ angular.module('SurveyQuestionFormDefinition', [])
                 editRequired: false,
                 column: 1
             },
+            // variable: {
+            //     label: 'Answer Variable Name',
+            //     type: 'text',
+            //     addRequired: true,
+            //     editRequired: true,
+            //     column: 1,
+            //     awPopOver: '<p>The suggested format for variable names are lowercase, underscore-seperated descriptive nouns.</p>'+
+            //                 '<p>For example: <br>foo_bar<br>\n user_id<br>\n host_name<br>' ,
+            //     dataTitle: 'Answer Variable Name',
+            //     dataPlacement: 'right',
+            //     dataContainer: "body"
+            // },
             variable: {
-                label: 'Answer Variable Name',
-                type: 'text',
+                ealName: 'variable',
+                type: 'custom',
+                control:'<label for="variable"><span class="label-text prepend-asterisk">Answer Variable Name</span>'+
+                    '<a id="awp-variable" href="" aw-pop-over="<p>The suggested format for variable names is lowercase and underscore-seperated. Also note that this field cannot accept variable names with spaces.</p><p>For example: <br>foo_bar<br>'+
+                    'user_id<br>host_name<br><div class=&quot;popover-footer&quot;><span class=&quot;key&quot;>esc</span> or click to close</div>" '+
+                    'data-placement="right" data-container="body" data-title="Answer Variable Name" class="help-link" data-original-title="" title="" tabindex="-1"><i class="fa fa-question-circle"></i></a> </label>'+
+                    '<div><input type="text" ng-model="variable" name="variable" id="survey_question_variable" class="form-control ng-pristine ng-invalid ng-invalid-required" required="" aw-survey-variable-name>'+
+                    '<div class="error ng-hide" id="survey_question-variable-required-error" ng-show="survey_question_form.variable.$dirty &amp;&amp; survey_question_form.variable.$error.required">A value is required!</div>'+
+                    '<div class="error ng-hide" id="survey_question-variable-required-error" ng-show="survey_question_form.variable.$dirty &amp;&amp; survey_question_form.variable.$error.variable">Please remove spaces</div>'+
+                    '<div class="error api-error ng-binding" id="survey_question-variable-api-error" ng-bind="variable_api_error"></div>'+
+                    '</div>',
                 addRequired: true,
                 editRequired: true,
                 column: 1
diff --git a/awx/ui/static/lib/ansible/directives.js b/awx/ui/static/lib/ansible/directives.js
index d98c9e9cf3..8282a43944 100644
--- a/awx/ui/static/lib/ansible/directives.js
+++ b/awx/ui/static/lib/ansible/directives.js
@@ -236,6 +236,26 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'AuthService', 'Job
         };
     })
 
+    //the awSurveyVariableName directive checks if the field contains any spaces.
+    // this could be elaborated in the future for other things we want to check this field against
+    .directive('awSurveyVariableName', function() {
+        // var FLOAT_REGEXP = /^\-?\d+((\.|\,)\d+)?$/;
+        return {
+            require: 'ngModel',
+            link: function(scope, elm, attrs, ctrl) {
+                ctrl.$parsers.unshift(function(viewValue) {
+                    if (viewValue.indexOf(' ') === -1) {
+                        ctrl.$setValidity('variable', true);
+                        return viewValue;
+                    } else {
+                        ctrl.$setValidity('variable', false);
+                        return undefined;
+                    }
+                });
+            }
+        };
+    })
+
     //
     // awRequiredWhen: { variable: "<variable to watch for true|false>", init:"true|false" }
     //