Skip to content

Commit 6101d16

Browse files
KendysondKendysond
committed
Datepicker and bug fixes for required input fields
1 parent 81b75a6 commit 6101d16

File tree

6 files changed

+201
-11
lines changed

6 files changed

+201
-11
lines changed

‎README.txt‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ Donate link: https://paystack.com/demo
44
Tags: paystack, recurrent payments, nigeria, mastercard, visa, target,Naira,payments,verve,donation,church,NGO,form,contact form 7, form,
55
Requires at least: 3.1
66
Tested up to: 4.7
7-
Stable tag: 2.1.5
7+
Stable tag: 2.1.7
88
License: GPLv2 or later
99
License URI: http://www.gnu.org/licenses/gpl-2.0.html
1010

@@ -84,6 +84,11 @@ You can also follow us on Twitter! **[@paystack](http://twitter.com/paystack)**
8484

8585

8686
== Changelog ==
87+
= 2.1.7 =
88+
* Fix bug with required input fields.
89+
* Added
90+
= 2.1.6 =
91+
* Fix bug with design breaking after installing the plugin.(SSL fix)
8792
= 2.1.5 =
8893
* Fix bug with agreement checkbox
8994
= 2.1.4 =

‎paystack-forms.php‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
Plugin Name: Payment forms for Paystack
44
Plugin URI: https://github.com/Kendysond/Wordpress-paystack-forms
55
Description: Payment forms for Paystack allows you create forms that will be used to bill clients for goods and services via Paystack.
6-
Version: 2.1.5
6+
Version: 2.1.7
77
Author: Douglas Kendyson
88
Author URI: http://kendyson.com
99
License: GPL-2.0+
@@ -15,7 +15,7 @@
1515
}
1616
define( 'KKD_PFF_PAYSTACK_PLUGIN_PATH', plugins_url( __FILE__ ) );
1717
define( 'KKD_PFF_PAYSTACK_MAIN_FILE', __FILE__ );
18-
define( 'KKD_PFF_PAYSTACK_VERSION', '2.1.5' );
18+
define( 'KKD_PFF_PAYSTACK_VERSION', '2.1.7' );
1919
define( 'KKD_PFF_PAYSTACK_TABLE', 'paystack_forms_payments' );
2020

2121

@@ -126,6 +126,14 @@ function insertRadiob(){
126126
);
127127
function insertCheckboxb(){
128128
QTags.insertContent('[checkbox name="Text Title" options="option 1,option 2,option 3"]');
129+
}
130+
QTags.addButton(
131+
"r_shortcode",
132+
"Insert Datepicker",
133+
insertDatepickerb
134+
);
135+
function insertDatepickerb(){
136+
QTags.insertContent('[datepicker name="Datepicker Title"]');
129137
}
130138
QTags.addButton(
131139
"i_shortcode",

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

Lines changed: 26 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,11 +35,12 @@ public static function fetchPublicKey(){
3535

3636
public function enqueue_scripts() {
3737

38-
wp_enqueue_script( 'blockUI', plugin_dir_url( __FILE__ ) . 'js/jquery.blockUI.min.js', array( 'jquery' ), $this->version, false );
38+
wp_enqueue_script( 'blockUI', plugin_dir_url( __FILE__ ) . 'js/jquery.blockUI.min.js', array( 'jquery' ), $this->version, true ,true );
39+
wp_enqueue_script( 'jQuery_UI', plugin_dir_url( __FILE__ ) . 'js/jquery.ui.min.js', array( 'jquery' ), $this->version, true ,true );
3940
wp_register_script('Paystack', 'https://js.paystack.co/v1/inline.js', false, '1');
4041
wp_enqueue_script('Paystack');
41-
wp_enqueue_script( 'paystack_frontend', plugin_dir_url( __FILE__ ) . 'js/paystack-forms-public.js', array( 'jquery' ), $this->version, false );
42-
wp_localize_script( 'paystack_frontend', 'settings', array('key'=> Kkd_Pff_Paystack_Public::fetchPublicKey()));
42+
wp_enqueue_script( 'paystack_frontend', plugin_dir_url( __FILE__ ) . 'js/paystack-forms-public.js', array( 'jquery' ), $this->version, true ,true );
43+
wp_localize_script( 'paystack_frontend', 'settings', array('key'=> Kkd_Pff_Paystack_Public::fetchPublicKey()), $this->version,true, true );
4344

4445
}
4546

@@ -924,6 +925,28 @@ function kkd_pff_paystack_form_shortcode($atts) {
924925
}
925926
add_shortcode( 'pff-paystack', 'kkd_pff_paystack_form_shortcode' );
926927

928+
function kkd_pff_paystack_datepicker_shortcode($atts) {
929+
extract(shortcode_atts(array(
930+
'name' => 'Title',
931+
'required' => '0',
932+
), $atts));
933+
$code = '<div class="span12 unit">
934+
<label class="label">'.$name;
935+
if ($required == 'required') {
936+
$code.= ' <span>*</span>';
937+
}
938+
$code.= '</label>
939+
<div class="input">
940+
<input type="text" class="date-picker" name="'.$name.'" placeholder="Enter '.$name.'"';
941+
if ($required == 'required') {
942+
$code.= ' required="required" ';
943+
}
944+
$code.= '" /></div></div>';
945+
return $code;
946+
}
947+
add_shortcode('datepicker', 'kkd_pff_paystack_datepicker_shortcode');
948+
949+
927950
function kkd_pff_paystack_text_shortcode($atts) {
928951
extract(shortcode_atts(array(
929952
'name' => 'Title',

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

Lines changed: 132 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1816,4 +1816,135 @@
18161816
}
18171817
.j-forms .inline {
18181818
display:inline-block !important;
1819-
}
1819+
}
1820+
1821+
1822+
/* Datapicker and Timepicker
1823+
=============================== */
1824+
.ui-datepicker {
1825+
background-color:#fff;
1826+
-webkit-border-radius:3px;
1827+
-moz-border-radius:3px;
1828+
-o-border-radius:3px;
1829+
border-radius:3px;
1830+
border:1px solid rgba(0,0,0,.26);
1831+
-webkit-box-shadow:0 0 2px rgba(0,0,0,.5);
1832+
-moz-box-shadow:0 0 2px rgba(0,0,0,.5);
1833+
-o-box-shadow:0 0 2px rgba(0,0,0,.5);
1834+
box-shadow:0 0 2px rgba(0,0,0,.5);
1835+
color:rgba(0,0,0,.54);
1836+
display:none;
1837+
font:16px 'Open Sans',Helvetica,Arial,sans-serif;
1838+
text-align:center;
1839+
padding:10px 0;
1840+
width:240px;
1841+
z-index:1100 !important;
1842+
}
1843+
.ui-datepicker-header {
1844+
background-color:#f0f0f0;
1845+
line-height:1.5;
1846+
margin:-2px 0 12px;
1847+
padding:10px;
1848+
position:relative;
1849+
}
1850+
.ui-datepicker-prev,
1851+
.ui-datepicker-next {
1852+
cursor:pointer;
1853+
display:block;
1854+
font-size:18px;
1855+
height:30px;
1856+
position:absolute;
1857+
text-decoration:none;
1858+
top:6px;
1859+
width:30px;
1860+
}
1861+
.ui-datepicker-prev { border-right:1px solid; left:0; }
1862+
1863+
.ui-datepicker-next { border-left:1px solid; right:0; }
1864+
1865+
.ui-datepicker-calendar { border-collapse:collapse; line-height:1.5; width:100%; }
1866+
1867+
.ui-datepicker-calendar th span { color:rgba(0,0,0,.26); font-weight:lighter; }
1868+
1869+
.ui-datepicker-calendar a,
1870+
.ui-datepicker-calendar span {
1871+
color:rgba(0,0,0,.54);
1872+
display:block;
1873+
font-size:16px;
1874+
margin:0 auto;
1875+
text-decoration:none;
1876+
width:28px;
1877+
}
1878+
.ui-datepicker-calendar a:hover,
1879+
.ui-datepicker-calendar .ui-state-active { background-color:#e0e0e0; }
1880+
1881+
.ui-datepicker-today a { outline:1px solid rgba(0,0,0,.54); }
1882+
1883+
.ui-datepicker-inline {
1884+
-webkit-box-sizing:border-box;
1885+
-moz-box-sizing:border-box;
1886+
box-sizing:border-box;
1887+
border:2px solid rgba(0,0,0,.12);
1888+
-webkit-box-shadow:none;
1889+
-moz-box-shadow:none;
1890+
-o-box-shadow:none;
1891+
box-shadow:none;
1892+
width:100%;
1893+
}
1894+
.ui-state-disabled span { color:rgba(0,0,0,.26); }
1895+
1896+
.ui-timepicker-div .ui-widget-header { background-color:#f0f0f0; margin-bottom:8px; padding:10px 0; }
1897+
1898+
.ui-timepicker-div dl { text-align:left; }
1899+
1900+
.ui-timepicker-div dl dt { float:left; clear:left; padding:0 0 0 5px; }
1901+
1902+
.ui-timepicker-div td { font-size:90%; }
1903+
1904+
.ui-tpicker-grid-label { background:none; border:none; margin:0; padding:0; }
1905+
1906+
.ui-timepicker-rtl{ direction:rtl; }
1907+
1908+
.ui-timepicker-rtl dl { text-align:right; padding:0 5px 0 0; }
1909+
1910+
.ui-timepicker-rtl dl dt{ float:right; clear:right; }
1911+
1912+
.ui-timepicker-rtl dl dd { margin:0 40% 10px 10px; }
1913+
1914+
.ui-timepicker-div { font-size:15px; }
1915+
1916+
.ui-timepicker-div dl {
1917+
-webkit-box-sizing:border-box;
1918+
-moz-box-sizing:border-box;
1919+
box-sizing:border-box;
1920+
border-top:1px solid rgba(0,0,0,.26);
1921+
padding:16px 5px;
1922+
margin:16px 0 0;
1923+
}
1924+
.ui-timepicker-div .ui_tpicker_time { margin:0 10px 10px 40%; }
1925+
1926+
.ui-timepicker-div .ui_tpicker_hour,
1927+
.ui-timepicker-div .ui_tpicker_minute { margin:16px 10px 10px 40%; }
1928+
1929+
.ui-datepicker-buttonpane { border-top:1px solid rgba(0,0,0,.26); }
1930+
1931+
.ui-datepicker-buttonpane button {
1932+
background:#e0e0e0;
1933+
border:none;
1934+
-webkit-border-radius:3px;
1935+
-moz-border-radius:3px;
1936+
-o-border-radius:3px;
1937+
border-radius:3px;
1938+
color:rgba(0,0,0,.56);
1939+
cursor:pointer;
1940+
font:14px 'Open Sans',Helvetica,Arial,sans-serif;
1941+
padding:5px 10px;
1942+
margin:10px 5px 0;
1943+
-webkit-transition:all.15s;
1944+
-moz-transition:all.15s;
1945+
-ms-transition:all.15s;
1946+
-o-transition:all.15s;
1947+
transition:all.15s;
1948+
outline:none;
1949+
}
1950+
.ui-datepicker-buttonpane button:hover { background:#d6d6d6; color:rgba(0,0,0,.87); }

‎public/js/jquery.ui.min.js‎

Lines changed: 8 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

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

Lines changed: 19 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,15 @@
33

44

55
$(document).ready(function($) {
6+
7+
$(function(){
8+
$(".date-picker").datepicker({
9+
dateFormat: 'mm/dd/yy',
10+
prevText: '<i class="fa fa-caret-left"></i>',
11+
nextText: '<i class="fa fa-caret-right"></i>'
12+
});
13+
});
14+
615
var international_card = false;
716
if( $('#pf-vamount').length ){
817
var amountField = $('#pf-vamount');
@@ -109,6 +118,7 @@
109118
}
110119
$('.paystack-form').on('submit', function(e) {
111120
var stop = false;
121+
112122
$("#pf-agreementicon").removeClass('rerror');
113123

114124
$(this).find("input,select, textarea").each(function() {
@@ -119,16 +129,18 @@
119129
if (Number(amount) > 0) {
120130
}else{
121131
$(this).find("#pf-amount").addClass('rerror');// css({ "border-color":"red" });
122-
stop = true;
132+
$('html,body').animate({ scrollTop: $('.rerror').offset().top - 110 }, 500);
133+
return false;
123134
}
124135
if (!validateEmail(email)) {
125136
$(this).find("#pf-email").addClass('rerror');//.css({ "border-color":"red" });
126-
stop = true;
137+
$('html,body').animate({ scrollTop: $('.rerror').offset().top - 110 }, 500);
138+
return false;
127139
}
128140
$(this).find("input, select, textarea").filter("[required]").filter(function() { return this.value == ''; }).each(function() {
129141
$(this).addClass('rerror');
130-
131-
stop = true;
142+
$('html,body').animate({ scrollTop: $('.rerror').offset().top - 110 }, 500);
143+
return false;
132144
});
133145
if($('#pf-agreement').length){
134146
if($("#pf-agreement").is(':checked')){
@@ -142,8 +154,11 @@
142154
return false;
143155

144156
}
157+
145158
}
146159

160+
161+
147162
var self = $(this);
148163
var $form = $(this);
149164
e.preventDefault();

0 commit comments

Comments
 (0)