Skip to content

Commit af3c21d

Browse files
KendysondKendysond
committed
Fixed form validation design, frontend Transfer transaction charges.
1 parent 3e6e5ba commit af3c21d

File tree

3 files changed

+85
-9
lines changed

3 files changed

+85
-9
lines changed

‎public/class-paystack-forms-public.php‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -633,16 +633,17 @@ function kkd_pff_paystack_form_shortcode($atts) {
633633
if ($recur == 'plan') {
634634
echo '<input type="text" name="pf-amount" value="'.$planamount.'" id="pf-amount" readonly required/>';
635635
}elseif($recur == 'optional'){
636-
echo '<input type="text" name="pf-amount" class="pf-number" id="pf-amount" required/>';
636+
echo '<input type="text" name="pf-amount" class="pf-number" id="pf-amount" value="0" required/>';
637637
}else{
638638
if ($amount == 0) {
639-
echo '<input type="text" name="pf-amount" class="pf-number" id="pf-amount" required/>';
639+
echo '<input type="text" name="pf-amount" class="pf-number" value="0" id="pf-amount" required/>';
640640
}else{
641641
echo '<input type="text" name="pf-amount" value="'.$amount.'" id="pf-amount" readonly required/>';
642642
}
643643
}
644-
645-
// echo '<input type="email" name="pf-pemail" placeholder="Email Address" id="pf-email" required>';
644+
if ($txncharge != 'merchant' && $recur != 'plan') {
645+
echo '<small>Transaction Charge: <b class="pf-txncharge">NGN1000</b>, Total:<b class="pf-txntotal">NGN1000</b></small>';
646+
}
646647

647648
echo '</div>
648649
</div>';

‎public/css/pff-paystack-style.css‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1778,3 +1778,11 @@
17781778
.j-forms .input input[readonly] {
17791779
cursor:not-allowed;
17801780
}
1781+
.j-forms .input small b {
1782+
color: #3676c8 !important;
1783+
font-size:14px !important;
1784+
}
1785+
.j-forms .input .rerror {
1786+
border-color: red !important;
1787+
}
1788+
/*#3676c8*/

‎public/js/paystack-forms-public.js‎

Lines changed: 72 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,68 @@
33

44

55
$(document).ready(function($) {
6+
var international_card = false;
7+
var amountField = $('#pf-amount');
8+
var max = 10;
9+
amountField.keydown(function(e) {
10+
format_validate(max, e);
11+
});
12+
13+
function format_validate(max, e) {
14+
var value = amountField.text();
15+
if (e.which != 8 && value.length > max) {
16+
e.preventDefault();
17+
}
18+
// Allow: backspace, delete, tab, escape, enter and .
19+
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
20+
// Allow: Ctrl+A
21+
(e.keyCode == 65 && e.ctrlKey === true) ||
22+
// Allow: Ctrl+C
23+
(e.keyCode == 67 && e.ctrlKey === true) ||
24+
// Allow: Ctrl+X
25+
(e.keyCode == 88 && e.ctrlKey === true) ||
26+
// Allow: home, end, left, right
27+
(e.keyCode >= 35 && e.keyCode <= 39)) {
28+
// let it happen, don't do anything
29+
calculateFees();
30+
return;
31+
}
32+
// Ensure that it is a number and stop the keypress
33+
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
34+
e.preventDefault();
35+
} else {
36+
calculateFees();
37+
}
38+
}
39+
40+
41+
$.fn.digits = function(){
42+
return this.each(function(){
43+
$(this).text( $(this).text().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,") );
44+
})
45+
}
46+
function calculateFees() {
47+
setTimeout(function() {
48+
var transaction_amount = parseInt(amountField.val());
49+
var multiplier = 0.0155;
50+
var fees = multiplier * transaction_amount;
51+
var extrafee = 0;
52+
if (fees > 2000) {
53+
var extrafee = 2000;
54+
}else{
55+
if (transaction_amount > 2500) {extrafee = 100};
56+
}
57+
var total = transaction_amount + fees + extrafee;
58+
if (transaction_amount == '' || transaction_amount == 0) {
59+
var total = 0;
60+
var fees = 0;
61+
}
62+
$(".pf-txncharge").hide().html("NGN"+fees.toFixed(2)).show().digits();
63+
$(".pf-txntotal").hide().html("NGN"+total.toFixed(2)).show().digits();
64+
}, 100);
65+
}
66+
67+
calculateFees();
668

769
$('.pf-number').keydown(function(event) {
870
if (event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9
@@ -23,26 +85,26 @@
2385
$('.paystack-form').on('submit', function(e) {
2486
var stop = false;
2587
$(this).find("input,select, textarea").each(function() {
26-
$(this).css({ "border-color":"#d1d1d1" });
88+
$(this).removeClass('rerror');//.css({ "border-color":"#d1d1d1" });
2789
});
2890
var email = $(this).find("#pf-email").val();
2991
var amount = $(this).find("#pf-amount").val();
3092
if (Number(amount) > 0) {
3193
}else{
32-
$(this).find("#pf-amount").css({ "border-color":"red" });
94+
$(this).find("#pf-amount").addClass('rerror');// css({ "border-color":"red" });
3395
stop = true;
3496
}
3597
if (!validateEmail(email)) {
36-
$(this).find("#pf-email").css({ "border-color":"red" });
98+
$(this).find("#pf-email").addClass('rerror');//.css({ "border-color":"red" });
3799
stop = true;
38100
}
39101
$(this).find("input, select, textarea").filter("[required]").filter(function() { return this.value == ''; }).each(function() {
40-
$(this).css({ "border-color":"red" });
102+
$(this).addClass('rerror');///.css({ "border-color":"red" });
41103
stop = true;
42104

43105
});
44106
if (stop) {
45-
$('html,body').animate({ scrollTop: $('.paystack-form').offset().top - 110 }, 500);
107+
$('html,body').animate({ scrollTop: $('.rerror').offset().top - 110 }, 500);
46108
return false;
47109

48110
}
@@ -92,6 +154,8 @@
92154
$(this).find("input, select, textarea").each(function() {
93155
$(this).css({ "border-color":"#d1d1d1" });
94156
});
157+
$(".pf-txncharge").hide().html("NGN0").show().digits();
158+
$(".pf-txntotal").hide().html("NGN0").show().digits();
95159

96160
$.unblockUI();
97161
}else{
@@ -126,6 +190,8 @@
126190
$(this).find("input, select, textarea").each(function() {
127191
$(this).css({ "border-color":"#d1d1d1" });
128192
});
193+
$(".pf-txncharge").hide().html("NGN0").show().digits();
194+
$(".pf-txntotal").hide().html("NGN0").show().digits();
129195

130196
$.unblockUI();
131197
}else{
@@ -140,6 +206,7 @@
140206
});
141207
}
142208

209+
143210
handler.openIframe();
144211
}else{
145212
alert(data.message);

0 commit comments

Comments
 (0)