diff --git a/api/js/etemplate/Et2InputWidget/Et2InputWidget.ts b/api/js/etemplate/Et2InputWidget/Et2InputWidget.ts index ff9f2ce347..121acb9e97 100644 --- a/api/js/etemplate/Et2InputWidget/Et2InputWidget.ts +++ b/api/js/etemplate/Et2InputWidget/Et2InputWidget.ts @@ -1,6 +1,6 @@ import {et2_IInput, et2_IInputNode, et2_ISubmitListener} from "../et2_core_interfaces"; import {Et2Widget} from "../Et2Widget/Et2Widget"; -import {dedupeMixin, PropertyValues} from "@lion/core"; +import {css, dedupeMixin, PropertyValues} from "@lion/core"; import {ManualMessage} from "../Validators/ManualMessage"; import {Required} from "../Validators/Required"; @@ -47,7 +47,12 @@ const Et2InputWidgetMixin = (superclass) => static get styles() { return [ - ...super.styles + super.styles, + css` + /* Needed so required can show through */ + ::slotted(input), input { + background-color: transparent; + }` ]; } @@ -67,11 +72,10 @@ const Et2InputWidgetMixin = (superclass) => type: Boolean }, - needed: { + required: { type: Boolean, reflect: true }, - onchange: { type: Function }, @@ -100,14 +104,13 @@ const Et2InputWidgetMixin = (superclass) => super.updated(changedProperties); // Needed changed, add / remove validator - if(changedProperties.has('needed')) + if(changedProperties.has('required')) { // Remove class this.classList.remove("et2_required") // Remove all existing Required validators (avoids duplicates) this.validators = (this.validators || []).filter((validator) => validator instanceof Required) - this.setAttribute("required", this.needed); - if(this.needed) + if(this.required) { this.validators.push(new Required()); this.classList.add("et2_required"); @@ -231,6 +234,7 @@ const Et2InputWidgetMixin = (superclass) => transformAttributes(attrs) { super.transformAttributes(attrs); + // Check whether an validation error entry exists if(this.id && this.getArrayMgr("validation_errors")) { diff --git a/api/js/etemplate/Et2Textbox/Et2Textbox.ts b/api/js/etemplate/Et2Textbox/Et2Textbox.ts index 21df1f54a5..7d5e43be95 100644 --- a/api/js/etemplate/Et2Textbox/Et2Textbox.ts +++ b/api/js/etemplate/Et2Textbox/Et2Textbox.ts @@ -19,7 +19,7 @@ export class Et2Textbox extends Et2InputWidget(LionInput) static get styles() { return [ - ...super.styles, + super.styles, css` :host([type="hidden"]) { display: none; diff --git a/api/js/etemplate/Et2Widget/Et2Widget.ts b/api/js/etemplate/Et2Widget/Et2Widget.ts index cecdb43feb..d518bd83df 100644 --- a/api/js/etemplate/Et2Widget/Et2Widget.ts +++ b/api/js/etemplate/Et2Widget/Et2Widget.ts @@ -1180,8 +1180,15 @@ function transformAttributes(widget, mgr : et2_arrayMgr, attributes) // If there is not attribute set, ignore it. Widget sets its own default. if(typeof attrValue === "undefined") { - return; + continue; } + + // "needed" is deprecated, use "required" + if(attribute == "needed") + { + attribute = "required"; + } + const property = widget_class.getPropertyOptions(attribute); switch(typeof property === "object" ? property.type : property) diff --git a/api/js/etemplate/etemplate2.ts b/api/js/etemplate/etemplate2.ts index f08fd21005..98d9264c90 100644 --- a/api/js/etemplate/etemplate2.ts +++ b/api/js/etemplate/etemplate2.ts @@ -930,9 +930,9 @@ export class etemplate2 } else if(submit instanceof Promise) { - invalid.push(submit.then(function(sub) + invalid.push(submit.then(function(ok) { - return sub ? false : this; + return ok ? false : this; }.bind(_widget))); } }, this, et2_ISubmitListener);