Item Creation: validate name on load

Signed-off-by: Jimmy Tanagra <jcode@tanagra.id.au>
openhab · Mar 24, 2024 · c1c5225 · c1c5225
1 parent a81bb0d
commit c1c5225
Showing 1 changed file with 4 additions and 6 deletions.
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -5,7 +5,7 @@
         <f7-list-input label="Name" type="text" placeholder="A unique identifier for the Item." :value="item.name"
                        :disabled="!createMode" :info="(createMode) ? 'Required. Note: cannot be changed after the creation' : ''"
                        required :error-message="nameErrorMessage" :error-message-force="!!nameErrorMessage"
-                       @input="onNameInput" :clear-button="createMode" />
+                       @input="item.name = $event.target.value" :clear-button="createMode" />
         <f7-list-input label="Label" type="text" placeholder="Item label for display purposes" :value="item.label"
                        @input="item.label = $event.target.value" :disabled="!editable" :clear-button="editable" />
       </f7-list-group>
@@ -110,7 +110,6 @@ export default {
       types,
       unitAutocomplete: null,
       categoryAutocomplete: null,
-      nameErrorMessage: '',
       oldItemType: !this.createMode ? this.item.type.split(':')[0] : '',
       oldItemDimension: (!this.createMode && this.item.type.split(':').length > 1) ? this.item.type.split(':')[1] : '',
       oldItemUnit: !this.createMode ? (this.item.unitSymbol || '') : ''
@@ -168,6 +167,9 @@ export default {
         this.$set(this.item, 'category', newCategory)
       }
     },
+    nameErrorMessage () {
+      return this.validateItemName(this.item.name)
+    },
     stateDescriptionPattern: {
       get () {
         if (this.item.stateDescriptionPattern) return this.item.stateDescriptionPattern
@@ -259,10 +261,6 @@ export default {
         }
       })
     },
-    onNameInput (event) {
-      this.item.name = event.target.value
-      this.$set(this, 'nameErrorMessage', this.validateItemName(this.item.name))
-    },
     deleteGroup (event) {
       const group = event.target.previousSibling.innerText
       const groupIndex = this.item.groupNames.indexOf(group)