Page 1 of 1

Is there a way...

Posted: Sun Jan 28, 2018 6:59 pm
by bry
Is there a way to automatically add hyphens to telephone numbers so the format is 909-999-9999 as an example??? Is there an input mask?

thanks

Re: Is there a way...

Posted: Sun Jan 28, 2018 7:10 pm
by Pablo
This requires JavaScript.
For example, https://igorescobar.github.io/jQuery-Mask-Plugin/

Re: Is there a way...

Posted: Sun Jan 28, 2018 8:39 pm
by bry
Thank you. Actually, I must use the format 999-999-9999 rather than ( and ) around the area code. That is so this info can be correctly imported into a database.

Can JavaScript be added to your form?

Thanks

Re: Is there a way...

Posted: Sun Jan 28, 2018 9:30 pm
by Pablo
Yes, you can add any third party script to WWB.
Note however that I cannot help you with the implementation of this code, because for me it may also take a lot of time to figure out how to use this.

Re: Is there a way...

Posted: Sun Jan 28, 2018 10:02 pm
by bry
I was just getting ready to look at your current form. I assume it uses java script with onblur for validation? If so, I can insert what I want.

Thanks

Re: Is there a way...

Posted: Sun Jan 28, 2018 10:25 pm
by Pablo
That depends on which validation type you are using.
However if you wish to add a mask to an input then you will need to implement your own code.

Re: Is there a way...

Posted: Sun Jan 28, 2018 11:32 pm
by bry
It looks like if I use your form and then use a validation with bubbles and then custom, a wb.validation.min.js file is created. If I wipe the contents of that file and put in the javascript for an onblur mask that I want, it may work. I will try playing with that.

Thanks

Re: Is there a way...

Posted: Sun Jan 28, 2018 11:46 pm
by BaconFries
bry take a look at the following fiddle try typing the telephone number you will see that ( ) brackets get added. Now try removing the brackets that are around the first three digits that are in the input and only these now click on Run and try typing again you should now get what you are asking.
Please note that this is for information only I have not written this it is provided "as is". I wouldn't recommend copying the code directly as at some point the external files could be removed and it will stop working.
Before

Code: Select all

<input type="tel" mask="(999) 999-9999"/>
After

Code: Select all

<input type="tel" mask="999 999-9999"/>
Mask

Re: Is there a way...

Posted: Sun Jan 28, 2018 11:50 pm
by BaconFries
bry take a look at the following fiddle try typing the telephone number you will see that ( ) brackets get added. Now try removing the brackets that are around the first three digits that are in the input and only these now click on Run and try typing again you should now get what you are asking.
Please note that this is for information only I have not written this it is provided "as is". I wouldn't recommend copying the code directly as at some point the external files could be removed and it will stop working.
Before

Code: Select all

<input type="tel" mask="(999) 999-9999"/>
After

Code: Select all

<input type="tel" mask="999 999-9999"/>
Mask

Re: Is there a way...

Posted: Mon Jan 29, 2018 12:00 am
by bry
Yes, thank you. I have been looking at Robin Herbots code on GitHub. He is definitely on top of it. I have gotten the code I need, I am just trying to figure the best way to combine it with the WB form. I have been studying the iframe shell method but am trying to shortcut with the current validation using bubbles which creates a javascript file. I probably won't get to it tonight. I am out of go juice or very close to empty.

Thanks very much for your research. I would run all tests on my testing server and so no real damage done in any circumstance.

Re: Is there a way...

Posted: Mon Jan 29, 2018 12:04 am
by bry
Please check out this demo script https://www.w3schools.com/jsref/tryit.a ... ur_onfocus

This would be a great script to add to form.

Re: Is there a way...

Posted: Mon Jan 29, 2018 7:01 am
by Pablo
It looks like if I use your form and then use a validation with bubbles and then custom, a wb.validation.min.js file is created. If I wipe the contents of that file and put in the javascript for an onblur mask that I want, it may work. I will try playing with that.
If you are going to implement you own validation then you should disable the built-in validation otherwise it will cause conflicts.
If you disable the built-in validation then the wb.validation.min.js will not be added.