Number Input, Allow null value, how do I set it to null?

I'm reading in some data into a Number Input. I have checked the "Allow null value" setting.
I don't want it to default to 0, I need to clear the value to undefined/empty.

If I call setValue(null) or setValue(undefined) I get an error: Error: `value` must be a number

I can backspace the 0 in a numbered input to have the value be empty, how do I programmatically do it?

Hey Nav!

This looks like a scenario we overlooked when adding the setValue() method to the numberInput- that was before the allow null option was recently added. I'll write up a bug report and follow up in this thread once we are able to prioritize work here!

In the meantime, one decent workaround would be to set the default value setting of the number input to a temporary state ( {{state1.value}} ), and then run state1.setValue(null) instead. A bit hacky, but this should help unblock you!

Hey Alex, thanks for the quick response. I don't think the workaround will work for us. The default value is the first step, but we have a table where onSelect we populate this number input (which is often null). So we need to set its' value to null somehow.

Any other workaround comes to mind?

Hey @nav! Another option is to use the number input's clearValue method which will set the value to either null or 0 depending on whether allowNull is true.

I'm getting a number_input_control.clearValue is not a function
I don't see clearValue() as a method on Number inputs

Hi @nav, timely with the update "Allow null value: Number Input components can now have an empty state of null instead of 0."


Turn "Allow null value" option to true and empty Default Value. This will be either "" or null, you can have a ternary operation there like {{ numberInput1.value == null || numberInput1.value == "" ? response for true : response for false }}.

Turns out clearValue() is available on Numbered Input! (just not documented)

Empty default fix is great. Thanks everyone!