1
0
-1

 

Hi Guys,

I've a phone number field in my form and I would like to have input mask of (08) 9999 9999

I've a form with mobile first experience so it is very important to do this neatly.

I plan to put ghost text of '(08) 9999 9999' on the field and expect user to type just the numbers but the field should apply the mask.

example:  http://jsfiddle.net/dKRGE/3/

Please let me know how this can be done.

cheers,

Parth

    CommentAdd your comment...

    2 answers

    1.  
      2
      1
      0

      Here's an article that provides a decent explaination of why you should avoid this sort of thing: https://www.sitepoint.com/working-phone-numbers-javascript/

      Basically telephone number are hard. There's very little consistency in number formats and they change all the time. You also run the risk of confusing or frustrating the user.

      But, if you really need to, you could do a replace on the text via JQuery, e.g.:

      text = text.replace(/(\d{4})(\d{4})/, "(08) $1 $2");

      See this stack overflow: http://stackoverflow.com/questions/8760070/how-to-format-a-phone-number-with-jquery

       

        CommentAdd your comment...
      1.  
        1
        0
        -1

        I have been informed that while this is probably possible, it will certainly not be easy in our tools. We are aware of this, and it will hopefully get easier in future versions of our form design tools.

        One of the huge advantages of a platform such as Avoka Transact is that you get a lot of built-in capabilities, and so many things become very easy. Conversely, sometimes there are things you'd like to customize, but that turns out to be difficult or impossible. 

        In this particular case, I do agree with the previous posting that you really should be very careful about choosing to do this. Do you really need the phone number to be highly structured and validated? Or do you just want to make it as easy as possible for a customer to type in their telephone number, in whatever form they are most comfortable with?

        1. umakanta dalai

          Hi,

          is the masking issue resolved?

          how to mask a user entered text field values and display the value on havor using maestro?

          this is applicable while prefiling the field values from prefill service.

          please guide .

        CommentAdd your comment...