Fix category did not display value on first load

This commit is contained in:
nathan 2022-10-03 09:12:00 -06:00
parent 8890ba801b
commit b5a2778168
3 changed files with 29 additions and 5 deletions

View File

@ -241,9 +241,8 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
* Careful when this is called. We change the value here, so an infinite loop is possible if the widget has * Careful when this is called. We change the value here, so an infinite loop is possible if the widget has
* onchange. * onchange.
* *
* @private
*/ */
private fix_bad_value() protected fix_bad_value()
{ {
if(this.multiple || (!this.emptyLabel && (!Array.isArray(this.select_options) || this.select_options.length == 0))) if(this.multiple || (!this.emptyLabel && (!Array.isArray(this.select_options) || this.select_options.length == 0)))
{ {
@ -322,7 +321,9 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
loadFromXML(_node : Element) loadFromXML(_node : Element)
{ {
super.loadFromXML(_node); super.loadFromXML(_node);
this.fix_bad_value();
// Wait for update to be complete before we check for bad value so extending selects can have a chance
this.updateComplete.then(() => this.fix_bad_value());
} }
/** @param {import('@lion/core').PropertyValues } changedProperties */ /** @param {import('@lion/core').PropertyValues } changedProperties */
@ -332,7 +333,7 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
if(changedProperties.has('select_options') || changedProperties.has("value") || changedProperties.has('emptyLabel')) if(changedProperties.has('select_options') || changedProperties.has("value") || changedProperties.has('emptyLabel'))
{ {
this.fix_bad_value(); this.updateComplete.then(() => this.fix_bad_value());
} }
if(changedProperties.has("select_options") && changedProperties.has("value")) if(changedProperties.has("select_options") && changedProperties.has("value"))
{ {

View File

@ -87,7 +87,7 @@ export class Et2SelectCategory extends Et2StaticSelectMixin(Et2Select)
if(changedProperties.has("global_categories") || changedProperties.has("application") || changedProperties.has("parentCat")) if(changedProperties.has("global_categories") || changedProperties.has("application") || changedProperties.has("parentCat"))
{ {
so.cat(this).then(options => this.fetchComplete = so.cat(this).then(options =>
{ {
this.static_options = cleanSelectOptions(options); this.static_options = cleanSelectOptions(options);
this.requestUpdate("select_options"); this.requestUpdate("select_options");

View File

@ -29,13 +29,19 @@ export const Et2StaticSelectMixin = <T extends Constructor<Et2WidgetWithSelect>>
class Et2StaticSelectOptions extends (superclass) class Et2StaticSelectOptions extends (superclass)
{ {
// Hold the static widget options separately so other options (like sent from server in sel_options) won't
// conflict or be wiped out
protected static_options : SelectOption[]; protected static_options : SelectOption[];
// If widget needs to fetch options from server, we might want to wait for them
protected fetchComplete : Promise<SelectOption[] | void>;
constructor(...args) constructor(...args)
{ {
super(...args); super(...args);
this.static_options = []; this.static_options = [];
this.fetchComplete = Promise.resolve();
// Trigger the options to get rendered into the DOM // Trigger the options to get rendered into the DOM
this.requestUpdate("select_options"); this.requestUpdate("select_options");
@ -63,6 +69,23 @@ export const Et2StaticSelectMixin = <T extends Constructor<Et2WidgetWithSelect>>
this.static_options = new_static_options; this.static_options = new_static_options;
this.requestUpdate("select_options"); this.requestUpdate("select_options");
} }
/**
* Override the parent fix_bad_value() to wait for server-side options
* to come back before we check to see if the value is not there.
*/
fix_bad_value()
{
this.fetchComplete.then(() =>
{
// @ts-ignore Doesn't know it's an Et2Select
if(typeof super.fix_bad_value == "function")
{
// @ts-ignore Doesn't know it's an Et2Select
super.fix_bad_value();
}
})
}
} }
return Et2StaticSelectOptions; return Et2StaticSelectOptions;