treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Forums

Illustration by Nick Sirotich

credit card input

  • krishyy
    Permalink to comment #

    Hello,

    I am trying to implement the credit card input type ..when I am start typing the digits I need to include dash every after 4 digits like this XXXX-XXXX-XXXX-XXXX and if it is amex card it should be like this XXXX-XXXXXX-XXXXX...

    can anyone help me with this?

    Thanks

  • lhoezee
    Permalink to comment #

    Are you using jQuery? If so you can use this plugin: http://digitalbush.com/projects/masked-input-plugin/

    If you are not using jQuery it might be worth using just for this reason.

    You might need to do a check based on what card they chose which would look something like this (not tested)

    
if ( $('#card_type_dropdown').change(function () {
     if ( $(this).val() == 'amex' )
     {
            $("#credit").mask("9999-999999-99999");
     }
     else { $("#credit").mask("9999-9999-9999-9999"); }
});

    **Note: ** I don't really know if .mask supports live change events, but using something with this plugin might be the easiest / quickest option.

    Hopefully that helps you a little bit.

Add a Comment