Custom field with preset input/mask

  • Resolved vanlier

    (@vanlier)


    1 year, 2 months ago

    We need to have customers enter their IBAN number (International Bank Account Number for use within Europe I think).

    The format is <2 digits country code><2 digits><4 character bank code><10 digit bank account number>. So an example would be:

    NL34RABO01155706234

    Is it possible to create a custom field with this input mask? Would be nice it there would be a graphical representation/preformatted field of the seperate parts like this (one field that you can type and backspace like it is one field but visually seperated). 2 examples:

    Most important would be the validation ofcourse. I don’t seem to have an option to define a custom input mask in the existsing fieldtypes.

    • This topic was modified 1 year, 2 months ago by vanlier.
Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Support Kris – WPMU DEV Support

    (@wpmudevsupport13)

    Hi @vanlier

    I hope you are doing well today.

    I pinged our SLS Team to review your query and see will there be something possible in this case. We will post an update here as soon as more information is available.

    Kind Regards,
    Kris

    Plugin Support Kris – WPMU DEV Support

    (@wpmudevsupport13)

    Hi @vanlier

    We can provide inputmask code but the you wants graphical representation and also this?one field that you can type and backspace like it is one field but visually seperated?is complex and out of scope.

    This is the code for input masking:

    add_action('wp_footer', 'wpmudev_mask_input_field_iban', 9999 );
function wpmudev_mask_input_field_iban() {
    ?>
    <script type="text/javascript">
    jQuery(document).ready(function($) {
		setTimeout(function() {
			$('.forminator-custom-form').trigger('after.load.forminator');
		}, 100);

		$(document).on('after.load.forminator', function(e, form_id) {
            if ( e.target.id == 'forminator-module-6' ) {
                Inputmask("AA99AAAA9999999999").mask("#text-1 input");
            }
        });
            
    });
    </script>
    <?php
}

    Please follow this guide to implement below code as a mu-plugin on your site https://wpmudev.com/docs/using-wordpress/installing-wordpress-plugins/#installing-mu-plugins

    Kind Regards,
    Kris

    Plugin Support Amin – WPMU DEV Support

    (@wpmudev-support2)

    Hello @vanlier ,

    We haven’t heard from you for over a week now, so it looks like the above code worked for you.

    Feel free to re-open this topic if needed.

    Kind regards
    Kasia

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Custom field with preset input/mask’ is closed to new replies.