Number formatting (Input Mask) for Text Boxes

  • Profile Image
    LeoC2
    Asked on July 16, 2013 at 05:14 PM

    When setting up a phone number field there is an option to set the format, very convenient. Would you consider doing this for all numeric fields? It would come in handy when entering zip codes (#####), monetary amounts (#,#.##), dates (##/##/##) and more!

  • Profile Image
    Mike_T
    Answered on July 16, 2013 at 06:01 PM

    Thank you for your suggestion.

    I have to agree with you, the formatting feature is really convenient on the Phone Number fields. Would you like to have the same Input Mask option to be added to the Text Boxes or would you like to see it improved in some way?

    We are looking forward to hearing from you, so that we will be able to forward a feature request to our Development Team.

  • Profile Image
    LeoC2
    Answered on July 18, 2013 at 05:29 PM

    Some ideas:

    __/__/__ (date) and __/__/____ (4 digit yr)

    __:__:__ (time)

    (___) ___-____ (phone) and ___-__-____

    #,.## (displays numbers with 2 decimals and thousands comma) and

    $#,.## (adds a dollar sign) and

    #.## (no dollar or thousands comma)

    Possibly something like ####-####-####-###? (for credit card info allowing for 16 or 15 digit entry)?

    I'm sure others may think of some more.

  • Profile Image
    EltonCris
    Answered on July 18, 2013 at 06:45 PM

    @LeoC2 

    You can actually do all that using the phone number input mask feature. Since that's a text box, you can easily to do the formattings you want. http://form.jotformpro.com/form/31986679487984?

    For the symbols and text, you just need to define it on the mask value and use # to be replaced by numbers.

    Let us know if there's anything I've missed here. Thanks!

  • Profile Image
    LeoC2
    Answered on July 18, 2013 at 06:52 PM

    Interesting. I'll give some a try. SO basically the user needs to set up a phone field but redefine it as something else. 

  • Profile Image
    EltonCris
    Answered on July 18, 2013 at 06:58 PM

    @LeoC2

    That's right! From phone field to text box with input mask. :)

  • Profile Image
    LeoC2
    Answered on July 18, 2013 at 07:02 PM

    OK, all well and good but it's not intuitive to have to use a phone field to create something else like a date input. I would like to see you put the masking ability on the other text fields also.

  • Profile Image
    Mike_T
    Answered on July 18, 2013 at 07:23 PM

    We have escalated the feature request ticket to our Development Team, so we hope that mentioned input mask option will be added to the standard Text Boxes.

    We will let you know once it is implemented.

  • Profile Image
    kenneth
    Answered on August 07, 2013 at 03:52 AM

    Hi, feature has been successfully implemented, we consider the masking inputs to text boxes to be more accurate on collecting specific data.

    To do this, click the "Input Mask" from the toolbar of textboxes and put your desired masking.
    Use '@' for letters(A-Z), '#' for numbers(0-9) and '*(asterisk)' for both(A-Z and 0-9). This supports upper and lower case.

    Please confirm if it works from your end. If you encounter any problems please let us know.

    Thanks,
    Kenneth 

  • Profile Image
    LeoC2
    Answered on August 07, 2013 at 11:18 AM

    This works very well so far. THANK YOU I'm sure it will be a big help to form designers.

    One question... For credit card fields I would like to formet them with dashes thus ####-####-####-#### whcih works fine for all but Amex which is 1 digit less. Is there a way to have the last digit "optional" so to speak so if someone enters 15 or 16 digits it still accepts the format but with just 3 numbers at the end instead of 4?

  • Profile Image
    abajan
    Answered on August 07, 2013 at 12:14 PM

    @LeoC2

    Unfortunately, this isn't possible with the current mask feature in the form builder. However, having examined the form to which I believe you're referring, a viable workaround would be to have a radio button field listing the major credit cards. A condition can then be attached to that field to show either the 16 digit input or the 15 digit one, depending on which credit card is selected. Here's a short form that illustrates what I mean.

  • Profile Image
    PrinceFaiz
    Answered on September 04, 2015 at 12:40 AM

    pleas send a full code text box input mask set
  • Profile Image
    Chriistian
    Answered on September 04, 2015 at 04:56 AM

    Hi,

     

    I have moved your query to a new thread. We will reply there soon as soon as possible.

     

    Regards.