Created
October 18, 2018 09:51
-
-
Save pounard/036f86b934250db5c3cc4a6813b0e259 to your computer and use it in GitHub Desktop.
IBAN input mask that does not work
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function applyIBANMaks(input) { | |
var mask = '____ ____ ____ ____ ____ ____ ____'.split(''); | |
var cursorPositionDelta = 0; | |
function strip(value) { | |
return value.split('').filter(function (chr) { | |
return /[a-zA-Z\d]/.test(chr); | |
}); | |
} | |
function apply(data, currentCursorPosition) { | |
var length = data.length; | |
var index = 0; | |
return mask.map(function(chr) { | |
index++; | |
if (index <= length && chr != '_') { | |
if (cursorPositionDelta < currentCursorPosition) { | |
cursorPositionDelta++; | |
} | |
return chr; | |
} | |
return data.shift(); | |
}).join(''); | |
} | |
function init() { | |
input.value = apply(strip(input.value)); | |
} | |
input.addEventListener('click', init); | |
input.addEventListener('keyup', function () { | |
cursorPositionDelta = 0; | |
var start = input.selectionStart; | |
var end = input.selectionEnd; | |
input.value = apply(strip(input.value), start); | |
input.selectionStart = start + cursorPositionDelta; | |
input.selectionEnd = end + cursorPositionDelta; | |
}); | |
init(input); | |
} | |
var selector = '[name="{{ full_name }}[value]"]'; | |
var input = document.querySelector(selector); | |
if (input) { | |
applyIBANMaks(input); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment