abc/php/application/views/front/payment.php

266 lines
14 KiB
PHP

<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
<!DOCTYPE html>
<html lang="en">
<head>
<?php $this->load->view('front/includes/header-script')?>
<title><?=TITLE?></title>
</head>
<body>
<header>
<div class="container">
<div class="logo d-flex">
<img src="<?=base_url();?>assets/front/img/logo.jpg" alt="">
<span class="d-flex align-items-center justify-content-center">
<h1>Registration Payment</h1>
</span>
</div>
</div>
</header>
<section>
<div class="container">
<?php echo form_open('hosted-payment'); ?>
<div class="select-payment">
<h3>Select Payment Type</h3><br>
<div class="credit d-flex">
<span> <input type="radio" checked name="payment_type" value="card" id="host1" class="radio" required><label for="host1"></label>Credit Card / Debit Card</span>
<span> <input type="radio" name="payment_type" value="invoice" id="host2" class="radio"><label for="host2"></label>Invoice Company <font style="font-weight: bold;">(Members Only)</font></span>
</div>
</div>
<div class="select-payment">
<h3>Company Details</h3>
<div class="card-detail">
<span class="d-flex">
<div class="col-md-4 d-flex no-pad"><label for="">Company Name:*</label><input type="text" id="acvv" name="company_name" required></div>
<div class="col-md-4 d-flex no-pad"><label for="">Billing Contact:*</label><input type="text" id="acvv" name="billing_contact" required></div>
<div class="col-md-4 d-flex no-pad"><label for="">Customer ID:</label><input type="text" id="acvv" name="customer_id"></div>
</span>
<span class="d-flex"><label for="">Street Address:*</label><input type="text" id="aaddress" name="street_adrs" required></span>
<span class="d-flex">
<div class="col-md-4 d-flex no-pad"><label for="">City:*</label><input type="text" name="city_name" required></div>
<div class="col-md-4 d-flex no-pad"><label for="">State:*</label>
<select id="state" class="required" name="state" style="margin-left: 4px;" tabindex="8">
<option value="">Choose State:</option>
<option value="AL">Alabama</option><option value="AK">Alaska</option><option value="AZ">Arizona</option><option value="AR">Arkansas</option><option value="CA">California</option><option value="CO">Colorado</option><option value="CT">Connecticut</option><option value="DE">Delaware</option><option value="FL">Florida</option><option value="GA">Georgia</option><option value="HI">Hawaii</option><option value="ID">Idaho</option><option value="IL">Illinois</option><option value="IN">Indiana</option><option value="IA">Iowa</option><option value="KS">Kansas</option><option value="KY">Kentucky</option><option value="LA">Louisiana</option><option value="ME">Maine</option><option value="MD">Maryland</option><option value="MA">Massachusetts</option><option value="MI">Michigan</option><option value="MN">Minnesota</option><option value="MS">Mississippi</option><option value="MO">Missouri</option><option value="MT">Montana</option><option value="NE">Nebraska</option><option value="NV">Nevada</option><option value="NH">New Hampshire</option><option value="NJ">New Jersey</option><option value="NM">New Mexico</option><option value="NY">New York</option><option value="NC">North Carolina</option><option value="ND">North Dakota</option><option value="OH">Ohio</option><option value="OK">Oklahoma</option><option value="OR">Oregon</option><option value="PA">Pennsylvania</option><option value="RI">Rhode Island</option><option value="SC">South Carolina</option><option value="SD">South Dakota</option><option value="TN">Tennessee</option><option value="TX">Texas</option><option value="UT">Utah</option><option value="VT">Vermont</option><option value="VA">Virginia</option><option value="WA">Washington</option><option value="WV">West Virginia</option><option value="WI">Wisconsin</option><option value="WY">Wyoming</option>
</select>
</div>
<div class="col-md-4 d-flex no-pad"><label for="">Postal Code:*</label><input type="text" name="post_code" required></div>
</span>
<span class="d-flex">
<div class="col-md-6 d-flex no-pad"><label for="">Phone Number:*</label><input type="text" class="yourphone" id="aphno" name="phone_no" required></div>
<div class="col-md-6 d-flex no-pad"><label for="">Fax Number: </label><input type="text" id="afaxno" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" name="fax_no"></div>
</span>
<span class="d-flex"><label for="" style="width:180px;">Additional Instructions:</label><textarea class="form-control" rows="5" id="comment" name="adtnal_instrction"></textarea></span>
</div>
</div>
<div class="select-payment">
<h3>Payment Details</h3>
<div class="credit comp-detail">
<!--<span class="d-flex"> <input type="checkbox" id="detail" class="check_box" onchange="AsAbove();"><label for="start"></label>Same as above</span>-->
<div class="form-group d-flex">
<span class="chk-abc"><input type="checkbox" value="Yes" name="details" id="start" class="chk-date1">
<label for="start"></label>Same as above</span>
</div>
<div class="company-details detail">
<span class="d-flex"><label for="" class="m-200 align-self-center">Card holder Name:*</label>
<input type="text" id="acard_holder" name="card_holder_name" required>
</span>
<span class="d-flex">
<div class="col-md-4 d-flex no-pad">
<label for="" class="m-200 text-center align-self-center">Card Type:*</label>
<select name="card_type" required>
<option value="">--Select--</option>
<option value="Express">American Express</option>
<option value="Master">Master Card</option>
<option value="Visa">Visa</option>
<option value="Discover">Discover Card</option>
</select>
</div>
<div class="col-md-8 d-flex no-pad">
<label for="" class="m-200 text-center align-self-center">Card Number:*
</label>
<input type="text" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" maxlength="16" name="card_number" required>
</div>
</span>
<span class="d-flex cd-sub">
<div class="col-md-4 d-flex no-pad">
<label for="" class="m-200 text-center align-self-center">Expiration Month:*</label>
<select class="col-md-6" name="exp_month" id="aexpmo" required>
<option selected value=''>--Select Month--</option>
<option value='Jan'>Janaury</option>
<option value='Feb'>February</option>
<option value='Mar'>March</option>
<option value='Apr'>April</option>
<option value='May'>May</option>
<option value='Jun'>June</option>
<option value='Jul'>July</option>
<option value='Aug'>August</option>
<option value='Sep'>September</option>
<option value='Oct'>October</option>
<option value='Nov'>November</option>
<option value='Dec'>December</option>
</select>
</div>
<div class="col-md-4 d-flex no-pad">
<label for="" class="m-200 text-center align-self-center">Exp Year:*</label>
<select class="col-md-6" id="aexpyar" name="exp_year" required>
<option selected value=''>--Select Year--</option>
<option value='2018'>2018</option>
<option value='2019'>2019</option>
<option value='2020'>2020</option>
<option value='2021'>2021</option>
<option value='2022'>2022</option>
<option value='2023'>2023</option>
<option value='2024'>2024</option>
<option value='2025'>2025</option>
<option value='2026'>2026</option>
<option value='2027'>2027</option>
<option value='2028'>2028</option>
<option value='2029'>2029</option>
<option value='2030'>2030</option>
<option value='2031'>2031</option>
<option value='2032'>2032</option>
<option value='2033'>2033</option>
<option value='2034'>2034</option>
<option value='2035'>2035</option>
<option value='2036'>2036</option>
<option value='2037'>2037</option>
</select>
</div>
<div class="col-md-4 d-flex no-pad"><label for="" class="m-200 text-right align-self-center">CVV Code:*</label>
<input type="text" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" id="acvv" name="cvv_code" required>
</div>
</span>
</div>
<!-- <div class="company-expand detail">
<span class="d-flex"><label for="" class="m-200 align-self-center">Card holder Name:*</label><input type="text" id="bcard_holder" name="c_cardholder_name"> </span>
<span class="d-flex"><label for="" class="m-200 align-self-center">Street Address*</label><input type="text" id="baddress" name="c_street_adrz"> </span>
<span class="d-flex cd-sub">
<div class="col-md-4 d-flex no-pad"><label for="" class="m-200 text-right align-self-center">Expiration Month:*</label>
<select name="c_exp_mnth" id="bexpmo">
<option selected value=''>--Select Month--</option>
<option value='Jan'>Janaury</option>
<option value='Feb'>February</option>
<option value='Mar'>March</option>
<option value='Apr'>April</option>
<option value='May'>May</option>
<option value='Jun'>June</option>
<option value='Jul'>July</option>
<option value='Aug'>August</option>
<option value='Sep'>September</option>
<option value='Oct'>October</option>
<option value='Nov'>November</option>
<option value='Dec'>December</option>
</select>
</div>
<div class="col-md-4 d-flex no-pad"><label for="" class="m-200 text-right align-self-center">Exp Year:*</label>
<select id="bexpyar" name="c_exp_year">
<option selected value=''>--Select Year--</option>
<option value='2018'>2018</option>
<option value='2019'>2019</option>
<option value='2020'>2020</option>
<option value='2021'>2021</option>
<option value='2022'>2022</option>
<option value='2023'>2023</option>
<option value='2024'>2024</option>
<option value='2025'>2025</option>
<option value='2026'>2026</option>
<option value='2027'>2027</option>
<option value='2028'>2028</option>
<option value='2029'>2029</option>
<option value='2030'>2030</option>
<option value='2031'>2031</option>
<option value='2032'>2032</option>
<option value='2033'>2033</option>
<option value='2034'>2034</option>
<option value='2035'>2035</option>
<option value='2036'>2036</option>
<option value='2037'>2037</option>
</select>
</div>
<div class="col-md-4 d-flex no-pad"><label for="" class="m-200 text-right align-self-center">CVV Code:*</label>
<input type="text" id="bcvv" name="c_ccv_code">
</div>
</span>
<span class="d-flex cd-sub">
<div class="col-md-6 d-flex no-pad"><label for="" class="m-200 text-right align-self-center">Phone Number:*</label>
<input type="text" id="bphno" name="c_phone_no"></div>
<div class="col-md-6 d-flex no-pad"><label for="" class="m-200 text-right align-self-center">Fax Number:*</label>
<input type="text" id="bfaxno" name="c_fax_no"></div>
</span>
</div> -->
</div>
</div>
<div class="select-payment">
<h3>Sale Information</h3>
<div class="credit d-flex sale-in">
<div class="p-2">Total Sale Amount:</div>
<div class="ml-auto p-2">$ <?=$this->session->userdata('granttotal');?>.00</div>
</div>
</div>
<div class="select-payment">
<h3>Notifications / Receipts</h3>
<div class="credit d-flex">
<span class="align-self-center"> <input type="checkbox" id="host5" class="check_box"><label for="host5"></label>Email me a receipt</span>
<span class="d-flex"> <label class="align-self-center m-200">Email Address:</label><input type="email" name="emai_id"></span>
</div>
</div>
<div class="d-flex justify-content-center bd-highlight mb-3">
<div class="p-2 bd-highlight"><button type="reset" class="btn clear-btn">Clear</button></div>
<div class="p-2 bd-highlight"><button type="submit" class="btn process-btn">Process</button></div>
</div>
<?php echo form_close(); ?>
<div class="abc-img d-flex flex-wrap justify-content-center align-items-center">
<img src="<?=base_url();?>assets/front/img/visa.png" alt="">
<img src="<?=base_url();?>assets/front/img/img.ssl.png" alt="">
<img src="<?=base_url();?>assets/front/img/data.png" alt="">
<img src="<?=base_url();?>assets/front/img/abc.png" alt="">
</div>
</div>
</section>
<?php $this->load->view('front/includes/footer-script')?>
<script type="text/javascript">
$(document).ready(function(){
$('input[type="checkbox"]').click(function(){
var inputValue = $(this).attr("id");
$("." + inputValue).toggle();
});
});
</script>
<!-- <script type="text/javascript">
function AsAbove() {
var cb = document.getElementById('detail');
var acdhd = document.getElementById('acard_holder');
var bcdhd = document.getElementById('bcard_holder');
var aadrs = document.getElementById('aaddress');
var badrs = document.getElementById('baddress');
var aexpm = document.getElementById('aexpmo');
var bexpm = document.getElementById('bexpmo');
var aexpy = document.getElementById('aexpyar');
var bexpy = document.getElementById('bexpyar');
var acvv = document.getElementById('acvv');
var bcvv = document.getElementById('bcvv');
var aphn = document.getElementById('aphno');
var bphn = document.getElementById('bphno');
var afaxno = document.getElementById('afaxno');
var bfaxno = document.getElementById('bfaxno');
if (cb.checked) {
bcdhd.value = acdhd.value;
badrs.value = aadrs.value;
bexpm.value = aexpm.value;
bexpy.value = aexpy.value;
bcvv.value = acvv.value;
bphn.value = aphn.value;
bfaxno.value = afaxno.value;
} else {
bcdhd.value = '';
badrs.value = '';
bexpm.value = '';
bexpy.value = '';
bcvv.value = '';
bphn.value = '';
bfaxno.value = '';
}
}
</script> -->
</body>
</html>