diff --git a/src/common/core/Validator/Validator.ts b/src/common/core/Validator/Validator.ts index 45e5acd..381f503 100644 --- a/src/common/core/Validator/Validator.ts +++ b/src/common/core/Validator/Validator.ts @@ -12,7 +12,7 @@ class Validator { } get name() { - return this.input?.name; + return this.input?.label ? this.input?.label : this.input?.name; } get error() { @@ -69,13 +69,17 @@ class Validator { } } if (!valid) { - const error = validatorErrors[rule]?.replaceAll('{- name}', firstUpper(this.name?.toString())); - this.error = ruleArray ? validRule?.[1]?.replaceAll('{- name}', firstUpper(this.name?.toString())) : error; + const error = ruleArray + ? validRule?.[1]?.replaceAll('{- name}', firstUpper(this.name?.toString())) + : validatorErrors[rule]?.replaceAll('{- name}', firstUpper(this.name?.toString())); + if (error) { + this.error = error; + } } return valid; }); const _return = validArr?.includes(false); - if (_return) { + if (!_return) { this.error = null; } this.valid = !_return; diff --git a/src/components/app-dropdown/AppDropdownElement.ts b/src/components/app-dropdown/AppDropdownElement.ts index d8b5430..c560526 100644 --- a/src/components/app-dropdown/AppDropdownElement.ts +++ b/src/components/app-dropdown/AppDropdownElement.ts @@ -143,6 +143,10 @@ class AppDropdownElement extends BaseComponentElement { setOpen = (isOpen) => { this.isOpen = isOpen; + if (!isOpen) { + this.validate(); + this.update(); + } }; openDropdown = (e?) => { @@ -152,6 +156,7 @@ class AppDropdownElement extends BaseComponentElement { closeDropdown = (e?) => { if (e?.target?.closest('app-dropdown')?.randId == this.randId) return; + if (!this.isOpen) return; this.setOpen(false); }; @@ -166,8 +171,8 @@ class AppDropdownElement extends BaseComponentElement { itemSelected = (e) => { const value = (e.target as HTMLSpanElement).getAttribute('data-value'); - this.setOpen(false); this.setValue(value); + this.setOpen(false); this.appForm?.inputChange(e); }; @@ -179,6 +184,20 @@ class AppDropdownElement extends BaseComponentElement { render = () => { const { label, error, errorMessage, isOpen, searchPhrase, items, selectedItem, displaykey, valuekey } = this; + const renderMessage = (label: string) => { + if (label) { + return html``; + } + return html``; + }; + + const renderError = (error: string) => { + if (error) { + return html`