diff --git a/api/js/etemplate/Et2Date/Et2Date.ts b/api/js/etemplate/Et2Date/Et2Date.ts index 2a16376145..df9265001b 100644 --- a/api/js/etemplate/Et2Date/Et2Date.ts +++ b/api/js/etemplate/Et2Date/Et2Date.ts @@ -9,7 +9,7 @@ */ -import {css, html, nothing} from "lit"; +import {css, html, nothing, PropertyValueMap} from "lit"; import 'lit-flatpickr'; import {dateStyles} from "./DateStyles"; import type {Instance} from 'flatpickr/dist/types/instance'; @@ -413,6 +413,19 @@ export class Et2Date extends Et2InputWidget(LitFlatpickr) this.findInputField()?.removeEventListener("input", this._handleInputChange); } + update(changedProperties : PropertyValueMap) + { + super.update(changedProperties); + + // Flatpickr puts some inputs we don't have direct control over + if(changedProperties.has("disabled")) + { + this._inputNode.disabled = this.disabled; + this._inputNode.requestUpdate("disabled"); + this._inputNode.shadowRoot.querySelectorAll("input").forEach(i => i.disabled = this.disabled); + } + } + /** * Override parent to skip call to CDN * @returns {Promise} @@ -719,6 +732,11 @@ export class Et2Date extends Et2InputWidget(LitFlatpickr) */ _handleInputChange(e : InputEvent) { + if(this.disabled) + { + return; + } + // Update const value = this.findInputField().value; @@ -1031,7 +1049,7 @@ export class Et2Date extends Et2InputWidget(LitFlatpickr) if(typeof egwIsMobile == "function" && egwIsMobile()) { // Plain input for mobile - return html``; + return html``; } // This element gets hidden and used for value, but copied by flatpickr and used for input return html` @@ -1042,16 +1060,16 @@ export class Et2Date extends Et2InputWidget(LitFlatpickr) > ${this._incrementButtonTemplate()} - + `; } protected _incrementButtonTemplate() { // No increment buttons on mobile - if(typeof egwIsMobile == "function" && egwIsMobile()) + if(typeof egwIsMobile == "function" && egwIsMobile() || this.disabled) { - return ''; + return nothing; } return html`