CODEWITHSUNDEEP
javascriptjqueryhtmlinput
Alejandro Paredes
Alejandro Paredes

Reputation: 121

Format credit card input JS or jQuery

I have a form and I ask for the user's credit card, after the input is left I would like to show the cc number like this: xxxxxxxxxxxx1111 or xxxx-xxxx-xxxx-1111 but without changing the input real value. Is possible to do this with javascript?

Upvotes: 1

Views: 609

Answers (1)

Poul Bak
Poul Bak

Reputation: 10929

Use an '<input type="hidden">' to save the cc number. That will automatically be posted to your server, when you submit the form.

Now you can change the visible input value to what you want.

To only show the last 4 digits (assuming the id of the visible input is 'cc' and the hidden input is 'hiddencc'):

var cc = $('#cc').val();
$('#hiddencc').val(cc);
var visblecc = cc.substr(cc.length - 4);
$('#cc').val('xxxx-xxxx-xxxx-' + visiblecc);

Now in server side code, check for 'hiddencc'' value.

Upvotes: 1

Related Questions