European IBAN is an anoying 20-digit long (2 alpha, 18 numeric) identification number.
Input and verification of this data is vulnerable to error. Drupal's Webform module
support the awesome "input_mask" feature via jquery.input_mask.js to improve
user's expierence.
You can easily include this feature into the 'Webform IBAN field' module if
webform_iban_field/src/Plugin/WebformElement/WebformIbanField.php
would extend Drupal\webform\Plugin\WebformElement\TextBase
instead of Drupal\webform\Plugin\WebformElementBase.
/**
* Provides a 'webform_iban_field' element.
*
* @WebformElement(
* id = "webform_iban_field",
* label = @Translation("Webform IBAN field"),
* description = @Translation("Provides a webform IBAN field."),
* category = @Translation("Other Elements"),
* )
*/
//class WebformIbanField extends WebformElementBase {
class WebformIbanField extends TextBase {
After that you can assign an input_mask to the iban webform field, e.g. 'AA99 9999 9999 9999 9999 99'
'#input_mask': 'AA99 9999 9999 9999 9999 99'
| Comment | File | Size | Author |
|---|---|---|---|
| #3 | webform_iban_field-3251423-3.patch | 769 bytes | joshahubbers |
| #3 | Schermafbeelding 2021-11-28 om 09.33.07.png | 511.4 KB | joshahubbers |
Comments
Comment #2
joshahubbers commentedHello @Jenger1965,
Thank you for your suggestion. I will consider changing this, but have to look into the consequences first.
Thereby the input mask
'AA99 9999 9999 9999 9999 99'should not be applied, because it does not fit with a lot of IBAN numbers. The Dutch IBAN for example has four letters as the second pair, and is shorter than your mask. Something like'AA99 AAAA 9999 9999 99'. There are many possibilities, as you can see here. So I am afraid there will not be a valid generic input mask that can be applied.Comment #3
joshahubbers commentedI have created a patch to move the field to TextBase. It provides some extra options, like prefill too, so I think it is a good idea.
@Jenger1965 If you could test the patch, and approve it, I will make a new release of the module.
Comment #4
joshahubbers commented