-
Notifications
You must be signed in to change notification settings - Fork 78
/
Copy pathindex.html
67 lines (57 loc) · 1.95 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<html>
<head>
<title>Example page</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="pagarme.js"></script>
<script>
$(document).ready(function() {
PagarMe.encryption_key = "ek_test_Ec8KhxISQ1tug1b8bCGxC2nXfxqRmk";
var form = $("#payment_form");
form.submit(function(event) {
var creditCard = new PagarMe.creditCard();
creditCard.fillFromFrom(form);
var fieldErrors = creditCard.fieldErrors();
var hasErrors = false;
for(var field in fieldErrors) { hasErrors = true; break; }
$("#payment_form #card_number").css('border', '3px solid green');
$("#payment_form #card_holder_name").css('border', '3px solid green');
$("#payment_form #card_expiracy_month").css('border', '3px solid green');
$("#payment_form #card_expiracy_year").css('border', '3px solid green');
$("#payment_form #card_cvv").css('border', '3px solid green');
if(hasErrors) {
for(var fieldName in fieldErrors) {
var field = $(form.find("#" + fieldName)[0]);
field.css('border', '3px solid red');
}
return false;
}
creditCard.generateHash(function(cardHash) {
console.log(cardHash);
form.append($('<input type="hidden" name="card_hash"/>').val(cardHash));
PagarMe.removeCardFieldsFromForm(form);
form.get(0).submit();
});
return false;
});
});
</script>
</head>
<body>
<form id="payment_form" action="http://0.0.0.0:3001/" method="GET">
Card number: <input type="text" id="card_number"/>
<br/>
Card holder name: <input type="text" id="card_holder_name"/>
<br/>
Card expiracy month: <input type="text" id="card_expiracy_month"/>
<br/>
Card expiracy year: <input type="text" id="card_expiracy_year"/>
<br/>
Card security code: <input type="text" id="card_cvv"/>
<br/>
<div id="field_errors">
</div>
<br/>
<input type="submit"></input>
</form>
</body>
</html>