Question

I used the Input Mask Jquery plugin to mask the credit card field.
My code in masking is as follows:

$(".cardField").mask("9999 9999 9999 9999");

The problem is i have also used the validator plugin with the following condition:

rules: {
    cardField: {
        required: true,
        digits: true,
        minlength: 16,
        maxlength: 16
    }
 }

Now whenever i type something, it always results to an error because of the spaces.
How can i solve this?

Also, before I submit it back using the $post, i want to return it as a number without spaces. I used the unmasked() method but it returns an object instead.

var creditCardValue = $(".cardField").unmask().mask("9999 9999 9999 9999");
        $(".cardField").val(creditCardValue);

so how i can do this correctly?

Thank you.

Answer 1

I’ve checked the plugin I believe you are using – JQuery Mask Plugin. But as far as I can see, the unmask method simply removes the forced formatting and the text box value is retained as such. For example –

Date – 12/12/2012 – with mask
Date – 12/12/2012 – after unmasking

So you’re stuck with having to remove the additional formatting yourself. You could consider, adding a custom validation for this particular field and then revert to a format of your desire on the server or before you post it to your server. That I think would be the only solution available to you now.