Skip to content

Instantly share code, notes, and snippets.

@jesseangell

jesseangell/gist:3a528d7edde10ddceff1

Last active August 29, 2015 14:12
Show Gist options
  • Save jesseangell/3a528d7edde10ddceff1 to your computer and use it in GitHub Desktop.
Save jesseangell/3a528d7edde10ddceff1 to your computer and use it in GitHub Desktop.
Download ZIP
cardscan-single-exp-date
Raw
gistfile1.txt
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Credit Card Form</title>
<style>
.forAppleCardScan {
width: 1px;
height: 1px;
margin-left: -1000px;
position: fixed;
display: block;
}
</head>
<body>
<form>
<fieldset>
<label for="ccName">Name on card</label>
<input id="ccName" name="ccName" type="text">
<label for="cc_number">Credit Card Number</label>
<input id="cc_number" name="cc_number" type="text" >
<label for="cc_exp_date">Expiration Date</label>
<input id="cc_exp_date" type="text" placeholder="mm/yyyy" >
<input class="forAppleCardScan" id="cardExpirationMonth" type="text">
<input class="forAppleCardScan" id="cardExpirationYear" type="text">
<input type="submit" value="Charge">
</fieldset>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.payment/1.0.2/jquery.payment.js"></script>
<script type="text/javascript">
$('#cardExpirationMonth, #cardExpirationYear').change(function() {
var month = $('#cardExpirationMonth').val();
var year = $('#cardExpirationYear').val();
$('#cc_exp_date').val(month+'/'+year)
});
$('#cc_number').payment('formatCardNumber');
$('#cc_exp_date').payment('formatCardExpiry');
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment