0
jquery와 stripe.js 플러그인을 사용하여 양식을 제출할 수 없습니다. 스트라이프 토큰을 만든 후 양식을 제출하고 싶습니다. Jquery 유효성 검사가 잘 작동하고 있습니다. 콘솔에 "객체가 함수가 아닙니다"라는 오류 메시지가 표시되면 토큰을 만들 수 있습니다.스트라이프 토큰을 작성한 후 양식을 제출하십시오.
<?php
if(count($_REQUEST)>4)
{
print_r($_REQUEST);
exit;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>untitled</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="generator" content="Geany 0.21" />
</head>
<body>
<script type="text/javascript" src="https://js.stripe.com/v2/"></script>
<script src="http://jqueryvalidation.org/files/lib/jquery.js"></script>
<script src="http://jqueryvalidation.org/files/dist/jquery.validate.js"></script>
<!-- ///////////////////////////////////////////////////////////////////////////////// -->
<!-- CONTACT FORM -->
<div class="col-lg-6">
<h1>CONTACT</h1>
<h3 class="service_h3">Say Hello! Ask something?</h3>
<form class="cmxform" id="signupForm" method="post" action="">
<fieldset>
<legend>Validating a complete form</legend>
<p>
<label for="firstname">Firstname</label>
<input id="firstname" name="firstname" type="text">
</p>
<p>
<label for="lastname">Lastname</label>
<input id="lastname" name="lastname" type="text">
</p>
<p>
<label for="username">Username</label>
<input id="username" name="username" type="text">
</p>
<fieldset>
<div class="cardform">
<span class="payment-errors"></span>
<div class="field">
<label>Card Number</label>
<input type="text" size="20" autocomplete="off" class="input card-number" value="4242424242424242">
</div>
<div class="field small">
<label>CVC</label>
<input type="text" size="4" autocomplete="off" class="input card-cvc" value="424">
</div>
<div class="field medium">
<label>Expiration (MM/YYYY)</label>
<input type="text" class="input card-expiry-month" size="2" placeholder="MM" value="05">
<input type="text" class="input card-expiry-year" size="4" placeholder="YYYY" value="2018">
</div>
</div>
</fieldset>
<p>
<input class="btn" type="submit" name="submit" id="submit" value="Submit"/>
</p>
</fieldset>
</form>
</div>
</body>
</html>
<script>
Stripe.setPublishableKey("pk_test_q8JKhn0ydXmENnxCnJxxV7xC");
function stripeResponseHandler(status, response) {
var $form = $('#signupForm');
if (response.error) {
// Show the errors on the form
$form.find('.payment-errors').text(response.error.message);
$form.find('#submit').prop('disabled', false);
} else {
// response contains id and card, which contains additional card details
var token = response.id;
// Insert the token into the form so it gets submitted to the server
$form.append($('<input type="hidden" name="stripeToken" />').val(token));
// and submit
$form.get(0).submit();
}
};
$().ready(function() {
$("#signupForm").validate({
rules: {
firstname: "required",
lastname: "required",
username: {
required: true,
minlength: 2
}
},
messages: {
firstname: "Please enter your firstname",
lastname: "Please enter your lastname",
username: {
required: "Please enter a username",
minlength: "Your username must consist of at least 2 characters"
}
},
submitHandler: function(form) {
Stripe.createToken({
number: $('.card-number').val(),
cvc: $('.card-cvc').val(),
exp_month: $('.card-expiry-month').val(),
exp_year: $('.card-expiry-year').val()
}, stripeResponseHandler);
return false; // submit from callback
}
});
});
</script>