How To Create Ip Address Input Mask Using Masked Input Widget

I use masked input widget, it was amazing widget that easy to use. But i was wondering how to create ip address input mask, i started by using


'mask' => '999.999.999.999',

then i test it, it works when in input 192.168.105.156 but when i want to input 10.1.0.1 it cant accept value i input through masked input. i try using


'mask' => '9?99.9?99.9?99.9?99',

but that mask not work as i expected. i check digital bush site for this plugin but can’t figure out how to arrage mask to work.

I think you need to define your own character map. If you define a character representing a segment of the IP address, you should be able to use that four times.

even if i use character map, every character only represent 1 character not optional character. that the main problem. i already try it.

i’m expecting something like this input mask using code like




$('.ip_address').mask('0ZZ.0ZZ.0ZZ.0ZZ', {translation: {'Z': {pattern: /[0-9]/, optional: true}}});



can i achieve the same result(optional character) using masked input widget because “By design, this plugin will reject input which doesn’t complete the mask

I suppose it makes sense; the plugin wouldn’t know when to jump to the next part of the mask if it accepted a variable number of characters.

I think you’ll either have to use a different plugin (this one seems to work pretty well - demo) or request that users enter all segments as three digits, (so 010.001.000.001).

Alternatively, you could provide four input boxes, one for each segment, and use javascript to improve navigation between them.