Skip to content

P
PERFORMA_REPLICA
Commit c943d9a0 by Nilu
Options

billing page changes

parent a4945b01
Showing with 56 additions and 35 deletions
cmsWebApp/webroot/extensions/adminportal/CustomServlets_adminPortal.xml
......@@ -53,6 +53,7 @@
<FORM name="*.saveClient" factory="Participant" class="performa.form.SaveClientFP"/>
<FORM name="*.saveCompany" factory="Participant" class="performa.form.SaveCompanyFP"/>
<FORM name="*.processCulture" factory="Participant" class="performa.form.ProcessCultureFP"/>
<FORM name="*.savePayment" factory="Participant" class="performa.form.MakePaymentFP"/>
</NODE>
<NODE name="job_assessment_criteria_add_jsp" factory="Participant">
......
cmsWebApp/webroot/extensions/adminportal/billing.jsp
......@@ -14,14 +14,6 @@
String nextPage = WebUtils.getSamePageInRenderMode(request, "Page");
%>
<script src="https://js.stripe.com/v3/"></script>
<script>
var stripePubKey = '<%= MakePaymentFP.STRIPE_PUB_KEY %>';
</script>
<oneit:script>
<!-- MUST be included after initializing stripePubKey -->
<oneit:script src="/scripts/performaStripe.js"/>
</oneit:script>
<script type="text/javascript">
$(document).ready(function()
{
......@@ -34,7 +26,7 @@
<div class="main-content-area">
<h1 class="page-title">My Hiring Team</h1>
<div class="my-company-area">
<oneit:form name="editCompany" method="post" enctype="multipart/form-data">
<oneit:form name="makePayment" method="post" enctype="multipart/form-data">
<div style="padding-left: 15px; padding-right: 15px;">
<oneit:dynInclude page="/extensions/applicantportal/inc/multifieldtext.jsp" data="<%= CollectionUtils.EMPTY_MAP%>"/>
......@@ -54,12 +46,10 @@
<label class="label-14">Your card details will be saved for future billing</label>
</div>
<div class="grey-area">
<div class="form-group hide">
<input type="hidden" name="stripe-token-id" />
</div>
<div class="form-group">
<label>Card Number</label>
<oneit:ormInput obj="<%= company %>" type="text" attributeName="CompanyName" cssClass="form-control" />
<div id="card-number" class="form-control">
</div>
</div>
<div class="form-group">
<label>Name on Card</label>
......@@ -68,17 +58,20 @@
<div class="form-group row">
<div class="col-md-4">
<label>Expires</label>
<oneit:ormEnum obj="<%= company %>" attributeName="Country" cssClass="form-control"/>
<div id="card-expiry" class="form-control">
</div>
</div>
<div class="col-md-4">
<label>CCV</label>
<oneit:ormEnum obj="<%= company %>" attributeName="State" cssClass="form-control"/>
<div id="card-cvc" class="form-control">
</div>
</div>
<div class="col-md-4">
<label>Postal Code</label>
<oneit:ormInput obj="<%= company %>" type="text" attributeName="PostCode" cssClass="form-control" />
</div>
</div>
<div id="card-errors" role="alert"></div>
<div class="form-group">
<oneit:button value="Save Card" name="saveCompany" cssClass="btn btn-primary btn-green large-btn"
requestAttribs="<%= CollectionUtils.mapEntry("nextPage", nextPage)
......@@ -90,22 +83,27 @@
</div>
</div>
<form action="/charge" method="post" id="payment-form">
<div class="form-row">
<label for="card-element">
Credit or debit card
</label>
<div id="card-element">
a Stripe Element will be inserted here.
</oneit:form>
<oneit:form name="editCompany" method="post" enctype="multipart/form-data">
<div class="row">
<div class="col-lg-4 col-md-4 col-sm-6">
<div class="form-group hide">
<input type="hidden" name="stripe-token-id" />
</div>
Used to display Element errors
<div id="card-errors" role="alert"></div>
</div>
<button>Submit Payment</button>
</form>
</div>
<oneit:button value="Pay" name="savePayment" cssClass="hide" id="payNow"
requestAttribs='<%= CollectionUtils.mapEntry("nextPage", nextPage)
.toMap() %>'/>
</oneit:form>
<script src="https://js.stripe.com/v3/"></script>
<script>
var stripePubKey = '<%= MakePaymentFP.STRIPE_PUB_KEY %>';
</script>
<oneit:script>
<!-- MUST be included after initializing stripePubKey -->
<oneit:script src="/scripts/performaStripe.js"/>
</oneit:script>
</div>
</div>
</div>
......
cmsWebApp/webroot/scripts/performaStripe.js
......@@ -26,15 +26,37 @@ cardExpiry.mount('#card-expiry');
var cardCvc = elements.create('cardCvc', {style: style});
cardCvc.mount('#card-cvc');
registerElements([cardNumber, cardExpiry, cardCvc], 'example2');
// Create an instance of the card Element
var card = elements.create('card', {style: style});
//var card = elements.create('card', {style: style});
// Add an instance of the card Element into the `card-element` <div>
card.mount('#card-element');
//card.mount('#card-element');
card.addEventListener('change', function(event) {
//card.addEventListener('change', function(event) {
// var displayError = document.getElementById('card-errors');
// if (event.error) {
// displayError.textContent = event.error.message;
// } else {
// displayError.textContent = '';
// }
//});
cardNumber.addEventListener('change', function(event) {
var displayError = document.getElementById('card-errors');
if (event.error) {
displayError.textContent = event.error.message;
} else {
displayError.textContent = '';
}
});
cardExpiry.addEventListener('change', function(event) {
var displayError = document.getElementById('card-errors');
if (event.error) {
displayError.textContent = event.error.message;
} else {
displayError.textContent = '';
}
});
cardCvc.addEventListener('change', function(event) {
var displayError = document.getElementById('card-errors');
if (event.error) {
displayError.textContent = event.error.message;
......@@ -44,11 +66,11 @@ card.addEventListener('change', function(event) {
});
// Create a token or display an error when the form is submitted.
var form = document.getElementById('payment-form');
var form = document.getElementById('makePayment');
form.addEventListener('submit', function(event) {
event.preventDefault();
stripe.createToken(card).then(function(result) {
stripe.createToken(cardNumber).then(function(result) {
if (result.error) {
// Inform the customer that there was an error
var errorElement = document.getElementById('card-errors');
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment