I’d like to format my IBAN input in a form to insert a dash ‘-’ in the following positions:
XXXX-XXXX-XXXX-XX-XXXXXXXXXX
So, 4-4-4-2-10.
I also want to be able to go back and edit the other numbers without getting any weird movements or any dash inserted.
I guess I have to use the ‘input’ event.
I have tried a few things I’ve seen but I’m not able to use them with Corvid since they are pure JS code.
Thank you in advance!
Do it like this:
Add a onchange event for the input element
Inside the event calculate the length of the input element value.
And if this value is 4 add a - to the string and then assign that value to the input element and so on…
Hello, thanks for answering. What I have already made use of regex to validate the iban. What I’d like to do now are the dashes to add automatically while the iban is being written. And I also don’t want to slice it in 4 digit pieces, I want the positions I said when I first postes this.
I can’t follow the method Thrishti said because if I want to edit the iban, when I delete a digit, a dash will be added.
Thanks in advance!
Did you ever get this issue resolved? You said that you tried a few things, but weren’t able to use them since they were “pure JS”. Corvid is also “pure JS” - Corvid understands all of Javascript, except for anything that accesses the DOM. Accessing window, and document elements such as div, span, button, etc is off-limits. The way to access elements on the page is only through $w.
Hi Yisrael! No, I didn’t. Couldn’t make it work.
Did you try your “pure JS” code?
What have you tried? What worked? What didn’t?
Hi Yisrael. I really appreciate your interest, thank you!
I would have look for what I found when I was trying to solve this, because since it wasn’t a priority but more of a user-friendly feature, I stopped working in it, since the work is due Wednesday.
Despite of that, I will be so glad to look for those examples I found on Wednesday.
If you don’t mind, what I have been struggling with and it’s needed for the due date is what I posted in the following post:
https://www.wix.com/corvid/forum/community-discussion/how-to-use-onpaymentupdate-event-handler-to-manage-paypal-paymentresult-status
If you have a bit of time and would be so kind to look that post, I would really appreciate it, and on Wednesday I will go back here to this post and post the examples I found that didn’t work in Corvid.
Thanks guys!
There might be many ways to solve this but what if,if you can detect the length of the string each time in the onchange event and say if previous length is greater than the new length then you are editing/deleting the IBAN and don’t add the - according to your desired criteria and if previous length is less than the new length, then you are adding the IBAN and add the - according to the criteria? Might work I guess. Just share what have you done till now and we can lead you from there…
Hi Dani 
I think that you can use the onInput() function to determine the length of the value and add the dashes accordingly, here’s how:
$w('#iban').onInput( (event) => {
let length = $w('#iban').value.length;
if (length === 4 || length === 8 || length === 12 || length === 14) {
$w('#iban').value = $w('#iban').value + '-';
}
})
Check it out (Not tested)
Hello Ahmad good try,
but i think this will not be correct.
With every —> “-” your total LENGHT increases by 1.
So your result should be perhaps something like this…
[1234-567-891-0-]
You forget to ad the new digit in the total LENGTH of digits, when putting in a new “-”
When you correct this little failure, then it should work fine.
You’re completely right, it needs improvements, I did mention that I didn’t test it out, I was just giving an idea.
Either ways, thanks for your note 
Nice work guys - teamwork!
Hey, thank you all guys! Really appreciate it!
Would it be something like this then:
$w('#iban').onInput( (event) => {
let length = $w('#iban').value.length;
if (length === 4 || length === 8 || length === 12 || length === 14) {
$w('#iban').value = $w('#iban').value + '-';
length++;
}
})
?
Thank you!
Hey Dani
Improved version that will hopefully work 
I’ve also included a functionality to save the IBAN value (without dashes) in a variable for future use.
$w('#iban').onInput( (event) => {
let length = $w('#iban').value.length;
let inputValue = $w('#iban').value;
let userInput; // The actual IBAN value for future use
switch (length) {
case 3:
$w('#iban').value += '-'
break;
case 8:
$w('#iban').value += '-';
break;
case 13:
$w('#iban').value += '-';
break;
case 16:
$w('#iban').value += '-';
break;
}
if (length >= 0 && length < 4) {
inputValue = userInput = inputValue.substr(0, length);
} else if (length > 4 && length < 9) {
userInput = inputValue.substr(0, 3) + inputValue.substr(5, length);
} else if (length > 9 && length < 13) {
userInput = inputValue.substr(0, 3) + inputValue.substr(5, 8) + inputValue.substr(10, length);
} else if (length > 13 && length < 16) {
userInput = inputValue.substr(0, 3) + inputValue.substr(5, 8) + inputValue.substr(10, 13) + inputValue.substr(15, length);
} else if (length > 16 && length < 28) {
userInput = inputValue.substr(0, 3) + inputValue.substr(5, 8) + inputValue.substr(10, 13) + inputValue.substr(15, 16) + inputValue.substr(18, 27);
}
})
Hi Ahmad! That’s so nice of you, thanks! I don’t understand though why there are breaks after case 4, case 13 and case 16 and not in case 9.
Could you explain it to me please?
Thanks!
And I believe the cases would have to be 4, 9, 14 and 17, since the dashes keep adding.
Human errors 
Mystery explained!
break added. Thank you for your note
No worries! Thank you 
Any idea for how to write what Thrishti Labs said before to allow deleting without dashes adding?
He said to save the length and compare it to the length after input. If the length is less that the new length then the user is deleting, otherwise he is adding and we can use the code to add the dashes.
But I don’t know how to do it to keep saving the length and comparing it to the new length every time the user inputs.
(I’m assuming the onInput event triggers if the user deletes too)