diff --git a/modules/yamlform_ui/js/yamlform_ui.element.js b/modules/yamlform_ui/js/yamlform_ui.element.js
new file mode 100644
index 0000000..5a3977b
--- /dev/null
+++ b/modules/yamlform_ui/js/yamlform_ui.element.js
@@ -0,0 +1,43 @@
+/**
+ * @file
+ * Javascript behaviors for form UI element.
+ */
+
+(function ($, Drupal, drupalSettings) {
+
+  'use strict';
+
+  /**
+   * Monitor the element's key (aka machine name).
+   *
+   * @type {Drupal~behavior}
+   */
+  Drupal.behaviors.yamlFormUiElementKey = {
+    attach: function (context) {
+      if (!$(context).find(':input[name="key"]').length) {
+        return;
+      }
+
+      // Monitor the machine name and display a warning when a reserved word is
+      // being used.
+      // There is no way to capture changes to the key val.
+      // @see core/misc/machine-name.js.
+      setInterval(function() {
+        var value = $(':input[name="key"]').val();
+        if ($.inArray(value, drupalSettings.yamlform_ui.reserved_keys) !== -1) {
+          // Customize and display the warning message.
+          $('[data-drupal-selector="edit-key-warning"]').html(
+            Drupal.t("Please avoid using the reserved word '@key' as the element's key.", {'@key': value})
+          ).show();
+        }
+        else {
+          // Hide the warning message.
+          $('[data-drupal-selector="edit-key-warning"]').hide();
+        }
+      }, 300);
+
+    }
+  };
+
+
+})(jQuery, Drupal, drupalSettings);
diff --git a/modules/yamlform_ui/src/Form/YamlFormUiElementFormBase.php b/modules/yamlform_ui/src/Form/YamlFormUiElementFormBase.php
index 9af7083..097c80d 100644
--- a/modules/yamlform_ui/src/Form/YamlFormUiElementFormBase.php
+++ b/modules/yamlform_ui/src/Form/YamlFormUiElementFormBase.php
@@ -131,6 +131,23 @@ abstract class YamlFormUiElementFormBase extends FormBase implements YamlFormUiE
       '#weight' => -50,
     ];
 
+    // Monitor the machine name and display a warning when a reserved word is
+    // being used.
+    if (empty($key)) {
+      $reserved_keys = ['form_build_id', 'form_token', 'form_id', 'data', 'op'];
+      $reserved_keys = array_merge($reserved_keys, array_keys(\Drupal::service('entity_field.manager')->getBaseFieldDefinitions('yamlform_submission')));
+      print(implode('<br>', $reserved_keys)); exit;
+      $form['#attached']['drupalSettings']['yamlform_ui']['reserved_keys'] = $reserved_keys;
+      $form['#attached']['library'][] = 'yamlform_ui/yamlform_ui.element';
+      $form['key_warning'] = [
+        '#type' => 'yamlform_message',
+        '#message_type' => 'warning',
+        '#message_message' => $this->t("Please avoid using the reserved word '@key' as the element's key."),
+        '#weight' => -100,
+        '#attributes' => ['style' => 'display:none'],
+      ];
+    }
+
     // Remove the key's help text (aka description) once it has been set.
     if ($key) {
       $form['key']['#description'] = NULL;
diff --git a/modules/yamlform_ui/yamlform_ui.libraries.yml b/modules/yamlform_ui/yamlform_ui.libraries.yml
index 0f4cc7f..947df87 100644
--- a/modules/yamlform_ui/yamlform_ui.libraries.yml
+++ b/modules/yamlform_ui/yamlform_ui.libraries.yml
@@ -3,3 +3,12 @@ yamlform_ui:
   css:
     theme:
       css/yamlform_ui.module.css: {}
+
+yamlform_ui.element:
+  version: 1.x
+  js:
+    js/yamlform_ui.element.js:  {}
+  dependencies:
+    - core/drupal
+    - core/jquery
+    - core/jquery.once