Only allow numbers for input field

Developers
1

Hello,

I have an input field (inside a custom property panel) and want to allow only numbers. Can I somehow validate or set the data type to float so that only numbers and no strings are allowed for the input?

I got a CustomPropertiesProvider.js:

export default function CustomPropertiesProvider(propertiesPanel, translate) {
    return function(groups) {
        ...
    }
    
    function createCustomProperty(element, translate) {
    return {
        id: 'customProp',
        label: translate('Custom Property'),
        entries: Props(element)
    };
}

as well as a Props.js:

export default function(element, propsType) {
    return [
        {
            id: 'customProp',
            element: element,
            component: Props,
            isEdited: isTextFieldEntryEdited
        }
    ];
}

export function Props(props) {
    const {element, id} = props;

    const modeling = useService('modeling');
    const translate = useService('translate');
    const debounce = useService('debounceInput');

    const getValue = () => {
        return customPropValue;
    };

    const setValue = function(value) {
        return modeling.updateProperties(element, {
            customPropName: name,
            customPropValue: value
        });
    };


    return <TextFieldEntry
        id={id}
        element={element}
        description={translate('Add a value to the property')}
        label={translate('Label for Property)}
        getValue={getValue}
        setValue={setValue}
        debounce={debounce}
    />;
}

Can you tell me where I have to add the validation / set the data type so only numbers are allowed for the input field?

Thanks in advance!

1 Like