Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn More

View all

Sign in to view all badges

Dynamically formatting phone number or date fields

Avatar

Avatar
Validate 10
Level 3
deepakt84913413
Level 3

Likes

6 likes

Total Posts

71 posts

Correct Reply

1 solution
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 1
View profile

Avatar
Validate 10
Level 3
deepakt84913413
Level 3

Likes

6 likes

Total Posts

71 posts

Correct Reply

1 solution
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 1
View profile
deepakt84913413
Level 3

28-02-2018

How do I format Phone number or date fields using rule editor?

I am able to format it after focusout of the field, but I am looking into how to do that dynamically while the user types in.

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Boost 50
Level 5
James_R_Green
Level 5

Likes

52 likes

Total Posts

191 posts

Correct Reply

47 solutions
Top badges earned
Boost 50
Validate 25
Validate 10
Validate 1
Boost 5
View profile

Avatar
Boost 50
Level 5
James_R_Green
Level 5

Likes

52 likes

Total Posts

191 posts

Correct Reply

47 solutions
Top badges earned
Boost 50
Validate 25
Validate 10
Validate 1
Boost 5
View profile
James_R_Green
Level 5

01-03-2018

deepakt84913413

You may already know, but the out of the box way to handle formatting is the "Display Pattern" on a field:

Screen Shot 2018-03-01 at 23.25.35.png

This is triggered when you exit the field and will reformat according to the pattern - I would recommend doing this.

If you really need to format as you type, you could do something like this on the "Initialize" trigger of a field, to add a listener as @navinkaushal suggested.

var $el = $("#" + this.id + " input" );

$el.keyup(function (el) {   

     var $element = $(el.target);

     var elementValue = $element.val();

     var upperCaseValue =  $element.val().toUpperCase();

     $element.val(upperCaseValue);

});

Thanks,

James

Answers (2)

Answers (2)

Avatar

Avatar
Validate 10
Level 3
deepakt84913413
Level 3

Likes

6 likes

Total Posts

71 posts

Correct Reply

1 solution
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 1
View profile

Avatar
Validate 10
Level 3
deepakt84913413
Level 3

Likes

6 likes

Total Posts

71 posts

Correct Reply

1 solution
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 1
View profile
deepakt84913413
Level 3

01-03-2018

Yeah. I was trying out a bunch of code for that but it has not been possible as of now. I was trying to see if anyone has any example code for that.

Avatar

Avatar
Give Back 5
Level 3
navinkaushal
Level 3

Likes

16 likes

Total Posts

70 posts

Correct Reply

7 solutions
Top badges earned
Give Back 5
Give Back 3
Give Back 25
Give Back 10
Give Back
View profile

Avatar
Give Back 5
Level 3
navinkaushal
Level 3

Likes

16 likes

Total Posts

70 posts

Correct Reply

7 solutions
Top badges earned
Give Back 5
Give Back 3
Give Back 25
Give Back 10
Give Back
View profile
navinkaushal
Level 3

28-02-2018

Add some custom JavaScript code onReady of form or onBlur/onKeypress/Keydown event of those field. You can put your own custom logic.

There are many formatted libraries available, can use them too.