extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-12-28 09:38:53 +01:00
Code Issues Packages Projects Releases Wiki Activity

Et2Email: Better handling of blur & showing validation error

Browse Source
This commit is contained in:
nathan 2023-12-20 10:33:09 -07:00
parent 838bf30c1f
commit d73aa3d998
1 changed files with 27 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
api/js/etemplate/Et2Email/Et2Email.ts
View File

@ -440,13 +440,13 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
/** Hides the listbox. */ /** Hides the listbox. */
async hide() async hide()
{ {
this.open = false;
this.requestUpdate("open");
if(!this.open || this.disabled) if(!this.open || this.disabled)
{ {
return undefined; return undefined;
} }
this.open = false;
this.requestUpdate("open");
return waitForEvent(this, 'sl-after-hide'); return waitForEvent(this, 'sl-after-hide');
} }
@ -609,20 +609,6 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
const path = event.composedPath(); const path = event.composedPath();
if(this && !path.includes(this)) if(this && !path.includes(this))
{ {
// If they had something OK typed, use it
if(this.addAddress(this._search.value.trim()))
{
this._search.value = "";
}
else if(this._search.value)
{
// Invalid input, show message
// Can't just call this.validate() since the input is not part of the value
let currentValue = this.value;
this.value = [this._search.value];
this.validate();
this.value = currentValue;
}
this.hide(); this.hide();
} }
}; };
@ -664,6 +650,9 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
private handleSearchFocus() private handleSearchFocus()
{ {
// Clear any manual message (errors on invalid search text)
this.set_validation_error(false);
this.hasFocus = true; this.hasFocus = true;
// Should not be needed, but not firing the update // Should not be needed, but not firing the update
this.requestUpdate("hasFocus"); this.requestUpdate("hasFocus");
@ -674,11 +663,27 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
this._search.setSelectionRange(this._search.value.length, this._search.value.length); this._search.setSelectionRange(this._search.value.length, this._search.value.length);
} }
private handleSearchBlur() private handleSearchBlur(event : FocusEvent)
{ {
this.hasFocus = false; this.hasFocus = false;
// Should not be needed, but not firing the update // Should not be needed, but not firing the update
this.requestUpdate("hasFocus"); this.requestUpdate("hasFocus");
// If they had something OK typed, use it, but only if focus went outside Et2Email
// because maybe they clicked an option which took focus
if(event.composedPath().includes(this))
{
if(this.addAddress(this._search.value.trim()))
{
this._search.value = "";
}
else if(this._search.value)
{
// Invalid input, show message. Not part of the value, so normal validation doesn't apply
// Can't just call this.validate(), it will get cleared immediately
this.set_validation_error(this.egw().lang("Invalid email") + ' "' + this._search.value + '"')
}
}
} }
handleSearchKeyDown(event) handleSearchKeyDown(event)
@ -908,6 +913,11 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
*/ */
handleSuggestionsMouseUp(event : MouseEvent) handleSuggestionsMouseUp(event : MouseEvent)
{ {
if(typeof event.target.value == "undefined")
{
return;
}
const value = ((<SlOption>event.target).value).replaceAll("___", " "); const value = ((<SlOption>event.target).value).replaceAll("___", " ");
this.addAddress(value); this.addAddress(value);
this._search.value = ""; this._search.value = "";