Format textarea or text input

[ADiecidue]

There are several textarea's and textinputs that I would like to format for money, numbers and specific types of data entered. For example, in one textinput I need all numbers like this:
####-####. Is there an easy, simple way to get the format needed for individual textinputs and textareas?

[ScottR]

If you use a number input instead that would be better - you can use the format dropdown for number input.

For phone number there are a few entries in the forum, you should be able to find. Or google regex and phone number and add the regex to the validation rule in the number input field....

As for text area, not sure as it depends on what you need to do.

[ADiecidue]

Phone numbers is one type of formatting that I would like to do. Also, something like ####-#### for the input so it comes out that way all the time.

[victoria]

Here's the solution from office hours (thank you for coming!)

This should work for a phone number! Make sure to use a text input and not a number input as the "On Change" behavior is slightly different.

This should work for something like ####-####:

function formatNumber(value) {
  if (!value) return value;
  const newNumber = value.replace(/[^\d]/g, '');
  const newNumberLength = newNumber.length;
  if (newNumberLength <= 4) return newNumber;
  return ${newNumber.slice(0, 4)}-${newNumber.slice(4)};
}

textInput2.setValue(formatNumber(textInput2.value));

1. Create a textInput component
2. Add an event handler
3. Set it to run on Change and "Run Script"
4. Paste in the above code! (Make sure to replace both mentions of textInput2 at the last line with the name of your textInput component)