Et2Select: Fix missing initial value when initial value is not in select_options

Our custom setter was not being called for some reason so option cleaning was not being done.
This commit is contained in:
nathan 2022-07-04 15:08:00 -06:00
parent 3af236e609
commit 31e476089c
2 changed files with 22 additions and 5 deletions

View File

@ -144,8 +144,6 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
{ {
super.connectedCallback(); super.connectedCallback();
this.fix_bad_value();
this.updateComplete.then(() => this.updateComplete.then(() =>
{ {
this.addEventListener("sl-clear", this._triggerChange) this.addEventListener("sl-clear", this._triggerChange)
@ -206,11 +204,17 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
*/ */
private fix_bad_value() private fix_bad_value()
{ {
if(this.multiple || !Array.isArray(this.select_options) || this.select_options.length == 0)
{
// Nothing to do here
return;
}
// If no value is set, choose the first option // If no value is set, choose the first option
// Only do this on firstUpdated() otherwise it is impossible to clear the field // Only do this on once during initial setup, or it can be impossible to clear the value
const valueArray = Array.isArray(this.value) ? this.value : (!this.value ? [] : this.value.toString().split(',')); const valueArray = Array.isArray(this.value) ? this.value : (!this.value ? [] : this.value.toString().split(','));
// value not in options --> use empty_label, if exists, or first option otherwise // value not in options --> use empty_label, if exists, or first option otherwise
if(this.value !== "" && !this.multiple && Array.isArray(this.select_options) && this.select_options.length > 0 && this.select_options.filter((option) => valueArray.find(val => val == option.value)).length === 0) if(this.select_options.filter((option) => valueArray.find(val => val == option.value)).length === 0)
{ {
this.value = this.empty_label ? "" : "" + this.select_options[0]?.value; this.value = this.empty_label ? "" : "" + this.select_options[0]?.value;
// ""+ to cast value of 0 to "0", to not replace with "" // ""+ to cast value of 0 to "0", to not replace with ""
@ -251,6 +255,19 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
} }
} }
/**
* Load extra stuff from the template node.
* Overridden from parent to force value to be "good", since this is the earliest place we have both value and
* select options when loading from a template.
*
* @param {Element} _node
*/
loadFromXML(_node : Element)
{
super.loadFromXML(_node);
this.fix_bad_value();
}
/** @param {import('@lion/core').PropertyValues } changedProperties */ /** @param {import('@lion/core').PropertyValues } changedProperties */
willUpdate(changedProperties : PropertyValues) willUpdate(changedProperties : PropertyValues)
{ {

View File

@ -78,7 +78,7 @@ export const Et2widgetWithSelectMixin = <T extends Constructor<LitElement>>(supe
* Will be found automatically based on ID and type, or can be set explicitly in the template using * Will be found automatically based on ID and type, or can be set explicitly in the template using
* <option/> children, or using widget.select_options = SelectOption[] * <option/> children, or using widget.select_options = SelectOption[]
*/ */
select_options: {type: Object}, select_options: {type: Object, noAccessor: true},
} }
} }