diff --git a/client/src/components/Form/Elements/FormNumber.vue b/client/src/components/Form/Elements/FormNumber.vue index a616bd3d8706..a2d1edb9af5c 100644 --- a/client/src/components/Form/Elements/FormNumber.vue +++ b/client/src/components/Form/Elements/FormNumber.vue @@ -38,11 +38,13 @@ export default { type: [Number, String], required: false, default: undefined, + validator: (prop) => typeof prop == "number" || prop === null, }, max: { type: [Number, String], required: false, default: undefined, + validator: (prop) => typeof prop == "number" || prop === null, }, workflowBuildingMode: { type: Boolean, @@ -74,7 +76,7 @@ export default { return this.workflowBuildingMode ? "text" : "number"; }, isRangeValid() { - return !isNaN(this.min) && !isNaN(this.max) && this.max > this.min; + return typeof this.min == "number" && typeof this.max == "number" && this.max > this.min; }, isInteger() { return this.type.toLowerCase() === "integer"; @@ -124,10 +126,15 @@ export default { } }, isOutOfRange(value) { - return this.isRangeValid && (value > this.max || value < this.min); + /* If value=null, then value is within range. */ + return ( + (typeof this.max == "number" && value > this.max) || (typeof this.min == "number" && value < this.min) + ); }, showOutOfRangeWarning(value) { - const warningMessage = `${value} is out of ${this.min} - ${this.max} range!`; + const rangeDetail = + typeof this.max == "number" && value > this.max ? `${value} > ${this.max}` : `${value} < ${this.min}`; + const warningMessage = `${value} is out of range! (${rangeDetail})`; this.showAlert(warningMessage); }, resetAlert() {