77 lines
2.8 KiB
Plaintext
77 lines
2.8 KiB
Plaintext
@*
|
|
For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
|
|
*@
|
|
@{
|
|
}
|
|
|
|
|
|
@section Scripts {
|
|
<script src="https://js.stripe.com/v3/"></script>
|
|
<script>
|
|
var stripe = Stripe('Your Secret key');
|
|
var elements = stripe.elements();
|
|
var style = {
|
|
base: {
|
|
fontSize: '16px',
|
|
color: '#32325d',
|
|
},
|
|
};
|
|
var card = elements.create('card', { style: style });
|
|
card.mount('#card-element');
|
|
var form = document.getElementById('payment-form');
|
|
form.addEventListener('submit', function (event) {
|
|
event.preventDefault();
|
|
stripe.createToken(card).then(function (result) {
|
|
if (result.error) {
|
|
var errorElement = document.getElementById('card-errors');
|
|
errorElement.textContent = result.error.message;
|
|
} else {
|
|
stripeTokenHandler(result.token);
|
|
}
|
|
});
|
|
});
|
|
function stripeTokenHandler(token) {
|
|
var form = document.getElementById('payment-form');
|
|
var hiddenInput = document.createElement('input');
|
|
hiddenInput.setAttribute('type', 'hidden');
|
|
hiddenInput.setAttribute('name', 'stripeToken');
|
|
hiddenInput.setAttribute('value', token.id);
|
|
form.appendChild(hiddenInput);
|
|
form.submit();
|
|
}
|
|
</script>
|
|
}
|
|
|
|
<form action="/cart/Create" method="post" id="payment-form">
|
|
<div class="col-sm-6">
|
|
<div class="panel panel-success">
|
|
<div class="panel-heading">
|
|
Credit Card Information
|
|
</div>
|
|
<div class="panel-body">
|
|
<div class="form-horizontal">
|
|
<div class="form-group">
|
|
<div class="col-sm-8">
|
|
<input type="number" class="form-control" name="Amount" placeholder="Amount" required />
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<div class="col-sm-8">
|
|
<input type="text" class="form-control" name="Currency" value="INR" readonly />
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<div class="col-sm-8">
|
|
<input type="text" class="form-control" name="Description" placeholder="Description" required />
|
|
</div>
|
|
</div>
|
|
<div id="card-element">
|
|
</div>
|
|
<div id="card-errors" role="alert"></div>
|
|
</div>
|
|
<br />
|
|
<input type="submit" value="Submit Payment" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form> |