IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Form validation problem in table panel option (column width & minimum column width) (#56452)

Browse Source 
Co-authored-by: gitstart <gitstart@users.noreply.github.com>
Co-authored-by: gitstart <gitstart@gitstart.com>
Co-authored-by: Rubens Rafael <70234898+RubensRafael@users.noreply.github.com>
Co-authored-by: Rafael Toledo <87545086+Toledodev@users.noreply.github.com>
Co-authored-by: Matheus Muniz <87545749+matheusmuniz03@users.noreply.github.com>
Co-authored-by: Thiago Nascimbeni <tnascimbeni@gmail.com>
Co-authored-by: Matheus Muniz <matheusmuniz100@hotmail.com>
Co-authored-by: Nitesh Singh <nitesh.singh@gitstart.dev>
Co-authored-by: Matheus Benini Ferreira <88898100+MatheusBeniniF@users.noreply.github.com>
Co-authored-by: Murilo Amaral <87545137+MuriloAmarals@users.noreply.github.com>
This commit is contained in:
GitStart 2022-10-07 09:06:50 -03:00 committed by GitHub
parent 22756913ba
commit 0eb3afbd14
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 31 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
public/app/core/components/OptionsUI/NumberInput.tsx
View File

@ -45,44 +45,46 @@ export class NumberInput extends PureComponent<Props, State> {
}
updateValue = () => {
let value: number | undefined = undefined;
const txt = this.inputRef.current?.value;
if (txt?.length) {
value = +txt;
if (isNaN(value)) {
return;
let corrected = false;
let newValue = '';
const min = this.props.min;
const max = this.props.max;
const currentValue = txt && +txt;
if (currentValue) {
if (!Number.isNaN(currentValue)) {
if (min != null && currentValue < min) {
newValue = min.toString();
corrected = true;
} else if (max != null && currentValue > max) {
newValue = max.toString();
corrected = true;
} else {
newValue = txt;
}
}
this.setState({
text: newValue || '',
inputCorrected: corrected,
});
if (corrected) {
this.updateValueDebounced();
}
if (!isNaN(currentValue) && currentValue !== this.props.value) {
this.props.onChange(currentValue);
}
}
if (value !== this.props.value) {
this.props.onChange(value);
}
if (this.state.inputCorrected) {
this.setState({ inputCorrected: false });
}
};
updateValueDebounced = debounce(this.updateValue, 500); // 1/2 second delay
onChange = (e: React.FocusEvent<HTMLInputElement>) => {
let newValue: string | undefined = undefined;
let corrected = false;
const min = this.props.min;
const max = this.props.max;
const currValue = e.currentTarget.valueAsNumber;
if (!Number.isNaN(currValue)) {
if (min != null && currValue < min) {
newValue = min.toString();
corrected = true;
} else if (max != null && currValue > max) {
newValue = max.toString();
corrected = true;
} else {
newValue = e.currentTarget.value;
}
}
this.setState({
text: newValue ? newValue : '',
inputCorrected: corrected,
text: e.currentTarget.value,
});
this.updateValueDebounced();
};