diff --git a/package-lock.json b/package-lock.json
index d72b67493..31e88a432 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7587,6 +7587,14 @@
       "resolved": "https://registry.npmjs.org/jquery-ui/-/jquery-ui-1.12.1.tgz",
       "integrity": "sha1-vLQEXI3QU5wTS8FIjN0+dop6nlE="
     },
+    "jquery-validation": {
+      "version": "1.17.0",
+      "resolved": "https://registry.npmjs.org/jquery-validation/-/jquery-validation-1.17.0.tgz",
+      "integrity": "sha512-XddiAwhGdWhcIJ+W3ri3KG8uTPMua4TPYuUIC8/E7lOyqdScG5xHuy9YishlKc0c/lIQai77EX7hxMdTSYCEjA==",
+      "requires": {
+        "jquery": "3.2.1"
+      }
+    },
     "js-base64": {
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.4.0.tgz",
diff --git a/package.json b/package.json
index 8ec3ef09d..00d60529c 100644
--- a/package.json
+++ b/package.json
@@ -80,6 +80,7 @@
     "html-webpack-plugin": "^2.30.1",
     "jquery": "^3.2.1",
     "jquery-ui": "^1.12.1",
+    "jquery-validation": "^1.17.0",
     "knockout": "~3.3.0",
     "knockout-mapping": "^2.6.0",
     "less": "^2.7.2",
diff --git a/src/bin/knockout-validation.js b/src/bin/knockout-validation.js
new file mode 100644
index 000000000..cd5d6ce5a
--- /dev/null
+++ b/src/bin/knockout-validation.js
@@ -0,0 +1,41 @@
+import $ from 'jquery';
+import ko from 'knockout';
+import 'jquery-validation';
+
+/**
+* Binds a form element to use jQuery validation tools
+* The argument should be a an object of settings from jQuery Validate.
+*
+* jQuery Validation Docs:
+* https://jqueryvalidation.org/validate/
+*
+* Usage Example
+* -------------
+*  <form class="form-horizontal" data-bind="validate: validationSettings">
+*    <!-- Inputs in a validated form must have a name. -->
+*    <input name="name" value="" type="text" />
+*    <!-- Either buttons or input[type=submit] works fine.. -->
+*    <input type="submit" value="Add" />
+*  </form>
+*
+*/
+ko.bindingHandlers.validate = {
+    init: (element, valueAccessor) => {
+        const value = valueAccessor();
+
+        // Add a new handler callback that adds the form as a param for
+        // checking overall validity.
+        // Preserve the old onfocusout in case it was being used.
+        value.ogonfocusout = value.onfocusout;
+        value.onfocusout = (input, event) => {
+            if (value.updateHandler) {
+                value.updateHandler($(element), input);
+            }
+            if (value.ogonfocusout) {
+                value.ogonfocusout(input, event);
+            }
+        };
+
+        $(element).validate(ko.unwrap(value));
+    }
+};
diff --git a/src/charactersheet/init.js b/src/charactersheet/init.js
index 43aecf790..454c5303b 100644
--- a/src/charactersheet/init.js
+++ b/src/charactersheet/init.js
@@ -1,3 +1,4 @@
+import 'bin/knockout-validation';
 import {
     AuthenticationServiceManager,
     ChatServiceManager,
diff --git a/src/charactersheet/viewmodels/character/features/index.html b/src/charactersheet/viewmodels/character/features/index.html
index be7a5571e..8e0531e7a 100644
--- a/src/charactersheet/viewmodels/character/features/index.html
+++ b/src/charactersheet/viewmodels/character/features/index.html
@@ -65,7 +65,7 @@
             id="addFeatureLabel">Add a new Feature.</h4>
       </div>
       <div class="modal-body">
-        <form class="form-horizontal">
+        <form class="form-horizontal" data-bind="validate: validation">
           <div class="form-group ui-front">
             <label for="name" class="col-sm-2 control-label">Name</label>
               <div class="col-sm-10">
@@ -73,6 +73,7 @@
                         class="form-control"
                         id="featureAddNameInput"
                         placeholder="Rage"
+                        name="name"
                         data-bind='textInput: blankFeature().name,
                         autocomplete: { source: featuresPrePopFilter,
                         onselect: populateFeature }, hasFocus: firstModalElementHasFocus'>
@@ -159,11 +160,11 @@
             </div>
           </div>
           <div class="modal-footer">
-            <button type="button"
+            <button type="submit"
                     class="btn btn-primary"
                     id="featureAddAddButton"
-                    data-bind='click: addFeature'
-                    data-dismiss="modal">Add</button>
+                    data-bind='disable: !addFormIsValid()'
+                    >Add</button>
             <p class="text-muted text-left" data-bind='visible: shouldShowDisclaimer'>
               <sm><i>This data is distributed under the
                 <a href='http://media.wizards.com/2016/downloads/DND/SRD-OGL_V5.1.pdf'
diff --git a/src/charactersheet/viewmodels/character/features/index.js b/src/charactersheet/viewmodels/character/features/index.js
index d2a2d4617..293a9e971 100644
--- a/src/charactersheet/viewmodels/character/features/index.js
+++ b/src/charactersheet/viewmodels/character/features/index.js
@@ -19,6 +19,7 @@ import ko from 'knockout';
 import meditation from 'images/meditation.svg';
 import template from './index.html';
 import uuid from 'node-uuid';
+import validation from './validation';
 
 export function FeaturesViewModel() {
     var self = this;
@@ -46,6 +47,7 @@ export function FeaturesViewModel() {
     self.editTabStatus = ko.observable('');
     self.firstModalElementHasFocus = ko.observable(false);
     self.editFirstModalElementHasFocus = ko.observable(false);
+    self.addFormIsValid = ko.observable(false);
     self.meditation = meditation;
     self.campingTent = campingTent;
 
@@ -209,9 +211,24 @@ export function FeaturesViewModel() {
     self.trackedPopoverText = function() {
         return 'Tracked Features are listed in the Tracker.';
     };
+
+    // Validation
+
+    self.validation = {
+        submitHandler: (form) => {
+            self.addFeature();
+        },
+        updateHandler: ($element) => {
+            self.addFormIsValid($element.valid());
+        },
+        rules: validation.rules,
+        messages: validation.messages
+    };
 }
 
 ko.components.register('features', {
     viewModel: FeaturesViewModel,
     template: template
 });
+
+
diff --git a/src/charactersheet/viewmodels/character/features/validation.js b/src/charactersheet/viewmodels/character/features/validation.js
new file mode 100644
index 000000000..2427162ab
--- /dev/null
+++ b/src/charactersheet/viewmodels/character/features/validation.js
@@ -0,0 +1,10 @@
+export default {
+    rules: {
+        name: {
+            required: true
+        }
+    },
+    messages: {
+//         name: "Please give me your name...",
+    }
+};