Question

Format radio button Other option to only accept numbers

Forms

Updated February 24, 2020

asked on January 16, 2019

When a number field is created on a form, it won't accept any characters as input except for numbers. That is how I want I want this input to behave but I'm not able to set it up as a number field. It is the "Other" choice on the radio button group.

I have a radio button set up on the form with the Other option. When the user chooses Other Rate and the input field opens, I would like the user to only be able to enter numbers. I've been able to use jquery to insert some parsley validation after looking at other inputs that are formatted for numbers and I have it working so that if the user enters anything other than text it shows it as Invalid.

But I'm wanting it to work like the number inputs work. I would like the input to be restricted to numbers only. Is that possible?

0 0

Replies

replied on January 16, 2019

In my experience, trying to add JavaScript to restrict the inputs creates a lot of headaches.

Personally, when I run into this problem I do the following instead.

Manually add an "Other" option (i.e., don't use the check box)
Add a number field to the form
Set a field rule to show the number field when the "other" option is selected
Use CSS to hide the label and reposition the input next to the "Other" option.

If you need to reference a single variable for some reason (in a workflow or something), you could create a hidden field (set to always hidden and save the value), then use a function like

=IF(RadioField<>"Other",RadioField,NumberField)

In your workflows, outflow conditions, etc., you could just reference this hidden field.

There are definitely ways to restrict input, but it can get messy.

1 0

replied on January 16, 2019

We do have a feature request in our backlog about putting restrictions and validation on the Other option input box. You cannot currently do this out of the box. There may be other solutions using JS though.

0 0

replied on January 16, 2019

This is probably already on the list, but a big one for me is max characters.

I've had to make a habit of adding JS to set a character limit every time I use an Other field because if I don't, someone eventually enters too many characters and breaks something (Murphy's Law).

1 0

replied on February 24, 2020

Don't know if it's still needed, but here is a two-line (or one depending on use) solution for this.

$('#Field253_other_value').prop('type', 'number');
  $('#Field253_other_value').prop('maxlength', 2);

The first line would need to be updated with your fields correct number (253 was mine, yours might be much smaller). The second line pops up an error if they try to enter over 2 characters (limiting the field to 99). The second line can also be changed to be a higher number if more than 99 is needed.

This code works for all HTML5 compliant browsers. Let me know if it doesn't work the way you want it to.

0 0

You are not allowed to follow up in this post.

Question

Question

Format radio button Other option to only accept numbers

Replies

Sign in to reply to this post.