I am using the digitalbush input mask for time. Currently, I have it set up as 0:00:00. When you enter the numbers, it populates from left to right. So adding a 1 would result in 1:00:00 ... adding another 1 results in 1:10:00. I would like it to go from right to left so a 1 would result in 0:00:01 .... adding another 1 would result in 0:00:11.
I have attached dir="rtl" to my input, which on it's own just formats the placeholder text to the right, doesn't affect the way the numbers are input. When I add numericInput:true, the numbers populate from right to left, exactly as I want, but it doesn't keep the placeholder values - it goes to _::.
Could someone please provide direction/know if this is possible? I found this Right to left mask input with jQuery but can't seem to make it work. Thanks!

I am using the digitalbush input mask for time. Currently, I have it set up as 0:00:00. When you enter the numbers, it populates from left to right. So adding a 1 would result in 1:00:00 ... adding another 1 results in 1:10:00. I would like it to go from right to left so a 1 would result in 0:00:01 .... adding another 1 would result in 0:00:11.
I have attached dir="rtl" to my input, which on it's own just formats the placeholder text to the right, doesn't affect the way the numbers are input. When I add numericInput:true, the numbers populate from right to left, exactly as I want, but it doesn't keep the placeholder values - it goes to _::.
Could someone please provide direction/know if this is possible? I found this Right to left mask input with jQuery but can't seem to make it work. Thanks!

• javascript
• jquery

Share Improve this question Follow edited May 23, 2017 at 10:31 CommunityBot 111 silver badge asked May 15, 2016 at 18:59 Hot WhiskeyHot Whiskey 8511 silver badge99 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

I ended up using RobinHerbots input mask.

My html input block:

<input type = "text" name = "result" id = "result" placeholder= "0:00:00" dir="rtl">

The jquery formatting:

$(document).ready(function(){
  $("#result").inputmask("9:99:99",{numericInput:true, placeholder:"0"});
});

The result of this is a placeholder 0:00:00 and when you type "1" it results in 0:00:01. Then a "23" you get 00:01:23 and so on...