Animate progress Bar on execution of PHP script using JQuery - javascript

I got a form that sends some information on a PHP page.
I managed to animate the progress bar on form submit and I would like to animate the progress bar on the script execution duration too.
My script gets the information and sends them to a lot of email addresses (like newsletters).
My FORM with the progress bar:
<form class="form-horizontal fadeIn animated" id="formImport" action="PHP/traitementImport.php" method="POST" enctype="multipart/form-data">
<div class="form-group">
<label class="col-sm-2 control-label">Catégorie</label>
<div class="col-sm-10">
<?php
$sql2 = "SELECT idg, intitule, titrefr, titreuk FROM groupe;";
$req2 = mysqli_query($mysqli, $sql2) or die('Erreur SQL !<br/>' . $sql2 . '<br/>' . mysqli_error($mysqli));
?>
<select class="form-control" name="categ" style="height:34px;" id="listeGroup">
<?php
while ($data2 = mysqli_fetch_array($req2)) { // Remplissage du SELECT
$idg = $data2['idg'];
$intitule = $data2['intitule'];
$titrefr = $data2['titrefr'];
$titreuk = $data2['titreuk'];
?>
<option value="<?php echo $idg ?>" class="valGroup"><?php echo $intitule ?></option>
<option value="<?php echo $titrefr ?>" id="<?php echo $idg ?>titrefr" style="display:none;"></option>
<option value="<?php echo $titreuk ?>" id="<?php echo $idg ?>titreuk" style="display:none;"></option>
<?php } ?>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Titre FR</label>
<div class="col-sm-10">
<input type="text" id="inputRapportFR" name="rapportFR" class="form-control" placeholder="Titre du rapport français">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Titre UK</label>
<div class="col-sm-10">
<input type="text" id="inputRapportUK" name="rapportUK" class="form-control" placeholder="Titre du rapport anglais">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Rapport FR</label>
<div class="col-sm-10">
<div class="input-group">
<span class="input-group-btn">
<span class="btn btn-primary btn-file">
Choisir dossier <input id="rapportFR" name="rapportFR[]" type="file" multiple directory="" webkitdirectory="" mozdirectory="">
</span>
</span>
<input type="text" class="form-control file" placeholder="RAPPORT FRANCAIS" readonly />
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Rapport UK</label>
<div class="col-sm-10">
<div class="input-group">
<span class="input-group-btn">
<span class="btn btn-primary btn-file">
Choisir dossier <input id="rapportUK" name="rapportUK[]" type="file" multiple directory="" webkitdirectory="" mozdirectory="">
</span>
</span>
<input type="text" class="form-control file" placeholder="RAPPORT ANGLAIS" readonly>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button id="btnEnvoyer" type="submit" class="btn btn-default">Envoyer</button>
</div>
</div>
</form>
<div class="progress" style="display:none;">
<div class="bar"></div>
<div class="percent">0%</div>
</div>
<div id="status"></div>
My Javascript Code:
(function () {
var bar = $('.bar');
var percent = $('.percent');
var status = $('#status');
$('form').ajaxForm({
beforeSend: function () {
$(".progress").show();
status.empty();
var percentVal = '0%';
bar.width(percentVal)
percent.html(percentVal);
},
uploadProgress: function (event, position, total, percentComplete) {
var percentVal = percentComplete + '%';
bar.width(percentVal)
percent.html(percentVal);
},
complete: function (xhr) {
bar.width("100%");
percent.html("100%");
status.html(xhr.responseText);
}
});
})();
I want to call 'MyScript.php', execute it without changing page and display and animate my progress bar on execution of it.

Related

How to make complete button process the data ? mean submit

i wanna ask how to make the final step process the data ? , i've tried use form method to redirect process but it not work . i'm using modal-steps.
Already search on stackoverflow but i got nothing, if somebody know how to do it please tellme.
i'm using this wizard https://www.jqueryscript.net/other/Wizard-Modal-Bootstrap-jQuery.html
! function(a) {
"use strict";
a.fn.modalSteps = function(b) {
var c = this,
d = a.extend({
btnCancelHtml: "Cancel",
btnPreviousHtml: "Previous",
btnNextHtml: "Next",
btnLastStepHtml: "Complete",
disableNextButton: !1,
completeCallback: function() {},
callbacks: {},
getTitleAndStep: function() {}
}, b),
e = function() {
var a = d.callbacks["*"];
if (void 0 !== a && "function" != typeof a) throw "everyStepCallback is not a function! I need a function";
if ("function" != typeof d.completeCallback) throw "completeCallback is not a function! I need a function";
for (var b in d.callbacks)
if (d.callbacks.hasOwnProperty(b)) {
var c = d.callbacks[b];
if ("*" !== b && void 0 !== c && "function" != typeof c) throw "Step " + b + " callback must be a function"
}
},
f = function(a) {
return void 0 !== a && "function" == typeof a && (a(), !0)
};
return c.on("show.bs.modal", function() {
var l, m, n, o, p, b = c.find(".modal-footer"),
g = b.find(".js-btn-step[data-orientation=cancel]"),
h = b.find(".js-btn-step[data-orientation=previous]"),
i = b.find(".js-btn-step[data-orientation=next]"),
j = d.callbacks["*"],
k = d.callbacks[1];
d.disableNextButton && i.attr("disabled", "disabled"), h.attr("disabled", "disabled"), e(), f(j), f(k), g.html(d.btnCancelHtml), h.html(d.btnPreviousHtml), i.html(d.btnNextHtml), m = a("<input>").attr({
type: "hidden",
id: "actual-step",
value: "1"
}), c.find("#actual-step").remove(), c.append(m), l = 1, p = l + 1, c.find("[data-step=" + l + "]").removeClass("hide"), i.attr("data-step", p), n = c.find("[data-step=" + l + "]").data("title"), o = a("<span>").addClass("label label-success").html(l), c.find(".js-title-step").append(o).append(" " + n), d.getTitleAndStep(m.attr("data-title"), l)
}).on("hidden.bs.modal", function() {
var a = c.find("#actual-step"),
b = c.find(".js-btn-step[data-orientation=next]");
c.find("[data-step]").not(c.find(".js-btn-step")).addClass("hide"), a.not(c.find(".js-btn-step")).remove(), b.attr("data-step", 1).html(d.btnNextHtml), c.find(".js-title-step").html("")
}), c.find(".js-btn-step").on("click", function() {
var m, n, o, p, b = a(this),
e = c.find("#actual-step"),
g = c.find(".js-btn-step[data-orientation=previous]"),
h = c.find(".js-btn-step[data-orientation=next]"),
i = c.find(".js-title-step"),
j = b.data("orientation"),
k = parseInt(e.val()),
l = d.callbacks["*"];
if (m = c.find("div[data-step]").length, "complete" === b.attr("data-step")) return d.completeCallback(), void c.modal("hide");
if ("next" === j) n = k + 1, g.attr("data-step", k), e.val(n);
else {
if ("previous" !== j) return void c.modal("hide");
n = k - 1, h.attr("data-step", k), g.attr("data-step", n - 1), e.val(k - 1)
}
parseInt(e.val()) === m ? h.attr("data-step", "complete").html(d.btnLastStepHtml) : h.attr("data-step", n).html(d.btnNextHtml), d.disableNextButton && h.attr("disabled", "disabled"), c.find("[data-step=" + k + "]").not(c.find(".js-btn-step")).addClass("hide"), c.find("[data-step=" + n + "]").not(c.find(".js-btn-step")).removeClass("hide"), parseInt(g.attr("data-step")) > 0 ? g.removeAttr("disabled") : g.attr("disabled", "disabled"), "previous" === j && h.removeAttr("disabled"), o = c.find("[data-step=" + n + "]"), o.attr("data-unlock-continue") && h.removeAttr("disabled"), p = o.attr("data-title");
var q = a("<span>").addClass("label label-success").html(n);
i.html(q).append(" " + p), d.getTitleAndStep(o.attr("data-title"), n);
var r = d.callbacks[e.val()];
f(l), f(r)
}), this
}
}(jQuery);
<div class="modal fade" id="order" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="js-title-step"></h4>
</div>
<div class="modal-body">
<form method="post" action="<?php echo base_url(); ?>pemesanan/submitorder">
<div class="row hide" data-step="1" data-title="Detail Pemesanan">
<div class="col-md-4">
<div class="form-group">
<label>Tanggal Pemesanan</label>
<input type="date" class="form-control" name="tanggal_pemesanan" id="tanggal_pemesanan" value="<?php if (empty($this->session->userdata('tanggal_pemesanan'))){
echo date('Y-m-d');
} else {
echo $this->session->userdata('tanggal_pemesanan');
} ?>" width="50%">
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label>Closer</label>
<select name="id_closer" id="id_closer" class="form-control selectpicker" data-live-search="true">
<option value="">Pilih Closer</option>
<?php
foreach($listcloser->result() as $closer) { ?>
<option value="<?php echo $closer->id_closer; ?>" <?php if ($this->session->userdata('id_closer') == $closer->id_closer ) {
echo "selected";
} ?>><?php echo $closer->nama_closer; ?></option>
<?php } ?>
</select>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label>Pelayanan</label>
<input type="text" name="pelayanan" class="form-control" id="pelayanan" placeholder="Pelayanan" value="<?php echo $this->session->userdata('pelayanan'); ?>">
</div>
</div>
</div>
<div class="row hide" data-step="2" data-title="Data Customer">
<div class="col-md-6">
<input type="hidden" name="halaman" value="pemesanan">
<label>Input Customer Baru</label>
<div class="form-group">
<input type="text" class="form-control" placeholder="Nama Customer" name="nama_customer" id="nama_customer">
</div>
<div class="form-group">
<input type="text" class="form-control" placeholder="No. HP/WA" name="nohp_wa" id="nohp_wa">
</div>
<div class="form-group">
<div class="form-group">
<input maxlength="100" type="text" id="sumber_informasi" class="form-control" placeholder="Sumber Informasi" />
</div>
</div>
<div class="form-group">
<label for="">Atau</label><br>
<select class="form-control selectpicker" data-live-search="true">
<option value="">Yang sudah ada</option>
<?php
foreach($listcustomers->result_array() as $cs)
{
$pilih='';
if($cs['id_customer']==$this->session->userdata("id_customer"))
{
$pilih='selected="selected"';
?>
<option value="<?php echo $cs['id_customer']; ?>" <?php echo $pilih; ?>><?php echo $cs['nama_customer']; ?></option>
<?php
}
else
{
?>
<option value="<?php echo $cs['id_customer']; ?>"><?php echo $cs['nama_customer']; ?></option>
<?php
}
}
?>
</select>
</div>
</div>
<div class="col-md-6">
<label>Input Data Anak</label>
<div class="form-group">
<input maxlength="100" type="text" id="nama_anak" required="required" class="form-control" placeholder="Nama Anak" />
</div>
<div class="form-group">
<select id="jenis_kelamin" class="form-control" required="required">
<option value="">Pilih Jenis Kelamin</option>
<option value="Laki-laki">Laki-laki</option>
<option value="Perempuan">Perempuan</option>
</select>
</div>
<div class="form-group">
<input maxlength="100" type="date" id="tanggal_lahir" max="<?php echo date('Y-m-d'); ?>" class="form-control" />
</div>
<div class="form-group">
<input type="text" class="form-control" placeholder="Nama Ayah" name="nama_ayah" id="nama_ayah">
</div>
<div class="form-group">
<input type="text" class="form-control" placeholder="Nama Ibu" name="nama_ibu" id="nama_ayah">
</div>
<div class="form-group">
<input maxlength="100" type="text" id="lahir_di" class="form-control" placeholder="Dilahirkan di" />
</div>
</div>
<!-- total tagihan -->
<!-- <div class="col-md-6">
<div class="form-group">
<label>Total Tagihan</label>
<span class="pull-right"><h1><?php echo $this->session->userdata('total') ?></h1></span>
</div>
</div>-->
<!-- end-->
</div>
<div class="row hide" data-step="3" data-title="Pesanan Hewan">
<div class="col-md-3">
<h3>Data Hewan</h3>
<div class="form-group">
<label>Tipe Hewan</label>
<select onchange="hitungpaketaqiqahsatuan()" class="form-control" style="width: 100%;" name="id_paketaqiqah" id="id_paketaqiqah" required>
<option value="">Pilih Tipe Hewan</option>
<?php
foreach($listpaketaqiqah->result_array() as $pa)
{
?>
<option value="<?php echo $pa['id_paketaqiqah']; ?>"><?php echo $pa['tipe_hewan']; ?></option>
<?php } ?>
</select>
</div>
<div class="form-group">
<label>Pilih Kandang</label>
<select onchange="" class="form-control" style="width: 100%;" name="id_kandang" id="id_kandang" required>
<option value="">Pilih Kandang</option>
<?php
foreach($listkandang->result() as $kandang) { ?>
<option value="<?php echo $kandang->id_lembaga; ?>"><?php echo $kandang->nama_lembaga; ?></option>
<?php } ?>
</select>
</div>
<div class="form-group">
<label>Tanggal Pemotongan</label>
<input type="date" min="<?php echo $this->session->userdata('tanggal_pemesanan');//date_format(date_add(date_create($this->session->userdata('tanggal_pemesanan')), date_interval_create_from_date_string('1 days')), 'Y-m-d'); ?>" class="form-control pemotongan" name="tanggal_potong" id="tanggal_potong" required >
</div>
<div class="form-group">
<label>Jam Pemotongan</label>
<div class="row">
<div class="col-md-6">
<input type="time" class="form-control pemotongan" name="jam_potong1" id="jam_potong1" required>
</div>
<div class="col-md-6">
<input type="time" class="form-control pemotongan" name="jam_potong2" id="jam_potong2" required>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<h3> </h3>
<div class="form-group">
<label>Disaksikan/Tidak</label>
<select class="form-control pemotongan" style="width: 100%;" name="disaksikan_tidak" id="disaksikan_tidak" required >
<option value="Disaksikan">Disaksikan</option>
<option value="Tidak disaksikan">Tidak disaksikan</option>
</select>
</div>
<div class="form-group">
<label>Catatan untuk kandang</label>
<textarea class="form-control" rows="4" placeholder="Catatan untuk kandang" name="catatan_untuk_kandang" id="catatan_untuk_kandang"></textarea>
</div>
<div class="form-group">
<label>Jumlah</label>
<input onchange="hitungpaketaqiqahsatuan()" type="number" class="form-control" placeholder="Jumlah" name="jumlah_paketaqiqah" id="jumlah_paketaqiqah" min="1" value="1" required>
</div>
</div>
<div class="col-md-3">
<h3>Paket Nasi Boks</h3>
<div class="form-group">
<label for="">Pilih Paket</label>
<select onchange="hitungpaketnasiboxsatuan()" class="form-control chosen-select" style="width: 100%;" name="id_paketnasibox" id="id_paketnasibox" required>
<option value="">Pilih</option>
<?php foreach($listpaketnasibox->result() as $pn) { ?>
<option value="<?php echo $pn->id_paketnasibox; ?>"><?php echo $pn->nama_paketnasibox; ?></option>
<?php } ?>
</select>
</div>
<div class="form-group">
<label>Jumlah</label>
<input onchange="hitungpaketaqiqahsatuan()" type="number" class="form-control" placeholder="Jumlah" name="jumlah_paketaqiqah" id="jumlah_paketaqiqah" min="1" value="1" required>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Catatan untuk dapur</label>
<textarea class="form-control" rows="4" placeholder="Catatan untuk dapur" name="catatan_untuk_dapur" id="catatan_untuk_dapur"></textarea>
</div>
</div>
<!--<div class="pull-right">
<div class="form-group">
<label style="margin-right: 10px">Total Tagihan</label>
<span class="" style="margin-right: 10px"><h1>Rp.0</h1></span>
</div>
</div>
-->
</div>
<div class="row hide" data-step="4" data-title="Pengantaran">
<div class="col-md-6">
<label> Input Data Pengiriman</label>
<div class="form-group">
<textarea class="form-control" placeholder="Alamat" name="alamat" id="alamat"></textarea>
</div>
<div class="form-group">
<label >Input URL Gmaps</label>
<input type="text" name="urlmaps" class="form-control">
</div>
<div class="form-group">
<label>Tanggal Pengiriman</label>
<input type="date" name="tanggal_kirim" class="form-control" min="<?php echo date_format(date_add(date_create($this->session->userdata('tanggal_pemesanan')), date_interval_create_from_date_string('1 days')), 'Y-m-d'); ?>" required>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Jam Kirim</label>
<input type="time" name="jam_kirim" class="form-control" required>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Jam Sampai</label>
<input type="time" name="jam_sampai" class="form-control" required>
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Tarif / Ongkos</label>
<input type="number" name="ongkos" class="form-control" min="0">
</div>
<div class="form-group">
<label>Petugas Pengantaran</label>
<?php foreach ($listdelivery->result() as $ld) { ?>
<div class="input-group">
<span class="input-group-addon">
<input type="radio" class="radiopetugaspengantaran" name="petugas_pengantaran" value="<?php echo $ld->id_lembaga;?>">
</span>
<input type="text" class="form-control" value="<?php echo $ld->nama_lembaga;?>" readonly>
<?php } ?>
</div>
<div class="input-group">
<span class="input-group-addon">
<input type="radio" class="radiopetugaspengantaran" name="petugas_pengantaran" value="Lainnya">
</span>
<input type="text" class="form-control" id="petugas_pengantaran" name="petugas_pengantaran_teks" value="Lainnya" disabled>
</div>
</div>
<!--<div class="form-group">
<label>Total Tagihan</label>
<span class="pull-right"><h1>Rp. 0</h1></span>
</div>-->
</div>
</div>
<div class="row hide" data-step="5" data-title="Pembayaran dan Tagihan">
<div class="col-md-6">
<div class="form-group">
<label>Diskon</label>
<input type="number" min="0" onkeyup="hitungtotaldansisa()" onchange="hitungtotaldansisa()" class="form-control" placeholder="Diskon" name="diskon" id="diskon" value="<?php echo $this->session->userdata('diskon'); ?>">
</div>
<div class="form-group">
<label>DP</label>
<input type="number" min="0" onkeyup="hitungtotaldansisa()" onchange="hitungtotaldansisa()" class="form-control" placeholder="DP" id="dp" name="dp" value="<?php echo $this->session->userdata('dp'); ?>">
</div>
<div class="form-group">
<label>Mekanisme Pembayaran</label>
<select class="form-control" id="mekanisme_pembayaran" name="mekanisme_pembayaran">
<option value="TUNAI" <?php if ($this->session->userdata('mekanisme_pembayaran') == "TUNAI" ) {
echo "selected";
} ?>>Tunai</option>
<option value="TRANSFER" <?php if ($this->session->userdata('mekanisme_pembayaran') == "TRANSFER" ) {
echo "selected";
} ?>>Transfer</option>
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Sisa</label>
<span class="pull-right"><h2>Rp. 0</h2></span>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Total Tagihan</label>
<span class="pull-right"><h2>Rp. 0</h2></span>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default js-btn-step pull-left" data-orientation="cancel" data-dismiss="modal"></button>
<button type="button" class="btn btn-warning js-btn-step" data-orientation="previous"></button>
<button type="button" class="btn btn-success js-btn-step" data-orientation="next"></button>
</div>
</form>
</div>
</div>
</div>
You can add one more button below the next button. Keep that button hidden till you reach the last step. When you reach the last step make it visible and on click of it write the logic to process your data.

Not able to fetch value for Update Data from database using jQuery Ajax Bootstrap Model - json data

My main problem is that my modal is showing but alert is showing [object Object]. I have four tables like stud,country_master_academic, master_city and master_state.When i click on edit, modal appears but data fetched from database is not showing in it.
jQuery in home.php page
$(document).ready(function(){
$(document).on('click', '.edit_data', function(event){
var stud_no = $(this).attr("id");
$.ajax({
url:"update.php",
method:"POST",
data:{stud_no:stud_no},
dataType:"json",
success:function(data){
console.log(data);
$('#name').val(data.name);
$('#mob_no').val(data.mob_no);
$('#dob').val(data.dob);
$('#add').val(data.add);
$('#photo').val(data.photo);
$('#gender').val(data.gender);
$('#country').val(data.country);
$('#state').val(data.state);
$('#city').val(data.city);
$('#stud_no').val(data.stud_no);
$('#update_data_modal').modal('show');
},
});
});
});
Modal for update in home.php page
<div class="container">
<div class="modal fade" id="update_data_modal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-heading" style="margin-top:30px;text-align:center">
<button class="close" data-dismiss="modal" style="margin-right:20px;font-weight:bold;">x</button>
<h4 class="modal-title"><span class="glyphicon glyphicon-edit"></span>Update Student</h4>
</div>
<div class="modal-body">
<?php
$img = "images/".trim($vrow["photo"]);
echo '<img src='.$img.' class="image" style="margin-left:75%;margin-top:5%;width:120px;height:120px;border:2px solid #bbbbbb;border-radius:10px;">';
?>
<br/>
<input type="file" name="photo" style="margin-left:70%;">
<div class="form-group">
<form class="form-horizontal" name="form" id="form" method="post" action="<?php $_PHP_SELF?>" enctype="multipart/form-data">
<label for="name" id="name"><span class="glyphicon glyphicon-user"></span><b> Student Name: </b></label>
<input type="text" class="form-control" name="name" id="name" pattern="[a-zA-Z]{3,}" title="Name should only contain letters and atleast 3 letters" required />
</div>
<div class="form-group">
<label for="no"><span class="glyphicon glyphicon-phone"></span><b> Mobile No: </b></label>
<input type="text" class="form-control" name="mob_no" id="mob_no" pattern="[0-9]{10}" title="Mobile number should be of 10 digits" required />
</div>
<div class="form-group">
<label for="dob"><span class="glyphicon glyphicon-calendar"></span><b> Birth Date: </b></label>
<input type="date" class="form-control" name="dob" id="dob" required />
</div>
<div class="form-group">
<label for="add"><span class="glyphicon glyphicon-map-marker"></span><b> Address: </b></label>
<textarea rows="4" cols="33" class="form-control" name="add" id="add" required></textarea>
</div>
<div class="form-group">
<label for="photo"><span class="glyphicon glyphicon-camera"></span><b> Photo: </b></label>
<input type="file" name="photo" id="photo" required />
</div>
<div class="form-group">
<label for="gen"><b> Gender: </b></label>
<input type="radio" name="gender" id="gender" value="M" required="required">Male
<input type="radio" name="gender" id="gender" value="F" required="required">Female
</div>
<div class="form-group">
<label for="cntry"><span class="glyphicon glyphicon-map-marker"></span><b> Country: </b></label>
<select name="country" id="country" class="form-control">
<option value="0">Select</option>
<?php
$country="SELECT * from country_master_academic";
$res= $conn->query($country);
if($res->num_rows>0){
while($row=$res->fetch_assoc()){
if($row["country_name"]==$vcountry or $vrow['country'] == $row["country_code"] )
{
echo '<option value='.$row["country_code"].' selected>'.$row["country_name"].'</option>';
}
else
{
echo '<option value='.$row["country_code"].'>'.$row["country_name"].'</option>';
}
}
}
?>
</select>
</div>
<div class="form-group">
<label for="state"><span class="glyphicon glyphicon-map-marker"></span><b> State: </b></label>
<select name="state" id="state" class="form-control">
<option value="0">Select</option>
<?php
$state="SELECT * from master_state";
$res= $conn->query($state);
if($res->num_rows>0){
while($row=$res->fetch_assoc()){
if($row["state_name"]==$vstate or $vrow['state'] == $row["state_code"] )
{
echo '<option value='.$row["state_code"].' selected>'.$row["state_name"].'</option>';
}
else
{
echo '<option value='.$row["state_code"].'>'.$row["state_name"].'</option>';
}
}
}
?>
</select>
</div>
<div class="form-group">
<label for="city"><span class="glyphicon glyphicon-map-marker"></span><b> City: </b></label>
<select name="city" id="city" class="form-control">
<option value="0">Select</option>
<?php
$city="SELECT * from master_city";
$res= $conn->query($city);
if($res->num_rows>0){
while($row=$res->fetch_assoc()){
if($row["city_name"]==$vcity or $vrow['city'] == $row["city_code"] )
{
echo '<option value='.$row["city_code"].' selected>'.$row["city_name"].'</option>';
}
else
{
echo '<option value='.$row["city_code"].'>'.$row["city_name"].'</option>';
}
}
}
?>
</select>
</div>
<div class="form-group">
<input type="hidden" name="stud_no" id="stud_no" />
<button type="submit" name="update" id="update" class="btn btn-info">Update</button>
</div>
</form>
</div>
<div class="modal-footer">
<button class="btn btn-danger" type="button" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
update.php page but still i am trying to fetch data, so only wrote code for selecting records from database.
My edit button which is kept in a loop
echo '<td><button name="edit" style="font-weight:bold;" type="submit" id='.$row["stud_no"].' class="btn btn-warning edit_data" data-target="#update_data_modal" data-toggle="modal"><span class="glyphicon glyphicon-edit"></span> Edit</button></td>';
Change in your html as below.
<div class="form-group">
<label for="gen"><b> Gender: </b></label>
<input type="radio" name="gender" id="genderMale" value="M" required="required">Male
<input type="radio" name="gender" id="genderFemale" value="F" required="required">Female
</div>
Add this code in your ajax success.
if(data[6] == 'M')
{
$("#genderMale").prop("checked", true);
} else if(data[6] == 'F') {
$("#genderFemale").prop("checked", true);
}
For image file you can use as below in your html
<div class="form-group">
<img id="resultedPhoto">
<label for="photo"><span class="glyphicon glyphicon-camera"></span><b> Photo: </b></label>
<input type="file" name="photo" id="photo" required />
</div>
Add below code in ajax success
$("#resultedPhoto").attr("src","/path-to-your-folder/" + data[5]);
As shown in the snapshot, your object has numeric indexes hence data.photo will not return anything as there is no index photo in your object.
You can access image name by using data[5].
Similarly you can get any index value.
Like for name instead of using data.name you need to use data[1]
So your code would be something like this:
$('#name').val(data[1]);
$('#mob_no').val(data[2]);
$('#dob').val(data[3]);
$('#add').val(data[4]);
$('#photo').val(data[5]);
Also you have given same ids for labels and inputs:
<label for="name" id="name">
You need to remove id from all labels:
<label for="name">
Now when i click on edit Modal is not opening and database value is getting empty
another jquery
$(document).ready(function(){
$("#form1").submit(function(event){
event.preventDefault();
var formData = new FormData(this);
$.ajax({
url:"upresult.php",
type:"POST",
data:{formData:formData},
async:false,
success:function(data) {
alert(data);
location.reload();
},
cache:false,
contentType:false,
processData:false
});
});
});
upresult.php
<?php
include("connection.php");
if(!empty($_POST)){
$no=$_POST['stud_no'];
$name=trim($_POST['name']);
$mob=trim($_POST['mob_no']);
$dob=trim($_POST['dob']);
$add=trim($_POST['add']);
$photo=trim($_FILES['photo']['name']);
$gen=trim($_POST['gender']);
$cn=trim($_POST['country']);
$st=trim($_POST['state']);
$ct=trim($_POST['city']);
$qry="update stud set stud_name='$name',mobile='$mob',dob='$dob',address='$add',gender='$gen',country='$cn',state='$st',city='$ct' where stud_no='$no'";
$data=mysqli_query($conn,$qry);
if($data)
{
echo '<script language="javascript">';
echo 'alert("Updated Successfully")';
echo '</script>';
}
else {
echo '<script language="javascript">';
echo 'alert("Cannot update record")';
echo '</script>';
}
if(!empty($_FILES['photo']['name'])){
$qry1= "update stud set photo='$photo' where stud_no='$no'";
$data1=mysqli_query($conn,$qry1);
if($data1){
$target_dir="images/";
$target_file=$target_dir.basename($_FILES["photo"]["name"]);
$imageFileType=pathinfo($target_file,PATHINFO_EXTENSION);
if(move_uploaded_file($_FILES["photo"]["tmp_name"],$target_file)){
echo '<script language="javascript">';
echo 'alert("Image upload successfully")';
echo '</script>';
} else {
echo '<script language="javascript">';
echo 'alert("Cannot Upload")';
echo '</script>';
}
}
}
}

Uncaught RangeError: Maximum call stack size exceeded jquery-1.11.3.min.js:5?

hello friends have this problem,when I click the link shows me the error: Uncaught RangeError: Maximum call stack size exceeded?
<a onclick='EditarMatricula();' class="btn blue btn-sm"><i class="fa fa-check-circle"></i> Actualizar</a>
This is mi code edit.php
<?php
include_once('../conexion.php');
$idEdit = $_POST['idEdit'];
$mat_edit = $DB_con->prepare("SELECT matricula.idmatricula, matricula.fecha, CONCAT(alumno.nombres,' ',alumno.apellidos) AS alumno, matricula.idalumno, periodo.nombre AS periodo, matricula.idperiodo, grado.nombre AS grado, matricula.idgrado, aula.nombre AS aula, matricula.idaula, matricula.tipo, matricula.turno FROM matricula INNER JOIN alumno ON matricula.idalumno = alumno.idalumno INNER JOIN periodo ON matricula.idperiodo = periodo.idperiodo INNER JOIN grado ON matricula.idgrado = grado.idgrado INNER JOIN aula ON matricula.idaula = aula.idaula WHERE matricula.idmatricula = $idEdit");
$mat_edit->execute();
$fila_matricula = $mat_edit->fetch(PDO::FETCH_ASSOC);
?>
<script>
$(function() {
$("#alumno_edit").autocomplete({
source: "autocompletar/buscaralunom.php",
minLength: 2,
select: function(event, ui) {
$('#idalumno_edit').val(ui.item.idalumno);
}
});
});
$(function() {
$("#periodo_edit").autocomplete({
source: "autocompletar/buscarpernom.php",
minLength: 2,
select: function(event, ui) {
$('#idperiodo_edit').val(ui.item.idperiodo);
}
});
});
$(function() {
$("#grado_edit").autocomplete({
source: "autocompletar/buscargranom.php",
minLength: 2,
select: function(event, ui) {
$('#idgrado_edit').val(ui.item.idgrado);
}
});
});
$(function() {
$("#aula_edit").autocomplete({
source: "autocompletar/buscaraulnom.php",
minLength: 2,
select: function(event, ui) {
$('#idaula_edit').val(ui.item.idaula);
}
});
});
</script>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">EDITAR MATRÍCULA</h4>
</div>
<div class="modal-body">
<form method="POST" class="form-horizontal well">
<div>
<input name="ideditar" id="ideditar" class="form-control" type="hidden" value="<?php print $fila_matricula['idmatricula'] ?>">
</div>
<div class="form-group">
<label class="col-lg-2 control-label">Fecha:</label>
<div class="col-lg-10">
<input name="fechamostrara_edit" id="fechamostrara_edit" class="form-control" required type="text" value="<?php print date("d-m-Y",strtotime($fila_matricula['fecha'])) ?>" readonly>
<input name="fecha_edit" id="fecha_edit" class="form-control" type="hidden" value="<?php print $fila_matricula['fecha'] ?>" readonly="">
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label">Alumno:</label>
<div class="col-lg-10">
<input name="alumno_edit" id="alumno_edit" class="form-control" type="text" value="<?php print $fila_matricula['alumno'] ?>">
<input name="idalumno_edit" id="idalumno_edit" class="form-control" type="hidden" value="<?php print $fila_matricula['idalumno'] ?>">
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label">Periodo:</label>
<div class="col-lg-10">
<input name="periodo_edit" id="periodo_edit" class="form-control" type="text" value="<?php print $fila_matricula['periodo'] ?>">
<input name="idperiodo_edit" id="idperiodo_edit" class="form-control" type="hidden" value="<?php print $fila_matricula['idperiodo'] ?>">
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label">Grado:</label>
<div class="col-lg-10">
<input name="grado_edit" id="grado_edit" class="form-control" type="text" value="<?php print $fila_matricula['grado'] ?>">
<input name="idgrado_edit" id="idgrado_edit" class="form-control" type="hidden" value="<?php print $fila_matricula['idgrado'] ?>">
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label">Aula:</label>
<div class="col-lg-10">
<input name="aula_edit" id="aula_edit" class="form-control" type="text" value="<?php print $fila_matricula['aula'] ?>">
<input name="idaula_edit" id="idaula_edit" class="form-control" type="hidden" value="<?php print $fila_matricula['idaula'] ?>">
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label">Tipo:</label>
<div class="col-lg-10">
<label class="radio-linea">
<input type="radio" name="tipo_edit" class="icheck" data-radio="iradio_flat-blue" value="Regular" <?php if ($fila_matricula['tipo'] == 'Regular') echo 'checked="checked"'; ?> > <span>Regular</span>
</label>
<label class="radio-linea">
<input type="radio" name="tipo_edit" class="icheck" data-radio="iradio_flat-blue" value="Becado" <?php if ($fila_matricula['tipo'] == 'Becado') echo 'checked="checked"'; ?> > <span>Becado</span>
</label>
<label class="radio-linea">
<input type="radio" name="tipo_edit" class="icheck" data-radio="iradio_flat-blue" value="Especial" <?php if ($fila_matricula['tipo'] == 'Especial') echo 'checked="checked"'; ?> > <span>Especial</span>
</label>
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label">Turno:</label>
<div class="col-lg-10">
<label class="radio-linea">
<input type="radio" name="turno_edit" class="icheck" data-radio="iradio_flat-blue" value="Mañana" <?php if ($fila_matricula['turno'] == 'Mañana') echo 'checked="checked"'; ?> > <span>Mañana</span>
</label>
<label class="radio-linea">
<input type="radio" name="turno_edit" class="icheck" data-radio="iradio_flat-blue" value="Tarde" <?php if ($fila_matricula['turno'] == 'Tarde') echo 'checked="checked"'; ?> > <span>Tarde</span>
</label>
<label class="radio-linea">
<input type="radio" name="turno_edit" class="icheck" data-radio="iradio_flat-blue" value="Noche" <?php if ($fila_matricula['turno'] == 'Noche') echo 'checked="checked"'; ?> > <span>Noche</span>
</label>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<a class="btn dark btn-sm" data-dismiss="modal"><i class="fa fa-times-circle"></i> Salir</a>
<a onclick='EditarMatricula();' class="btn blue btn-sm"><i class="fa fa-check-circle"></i> Actualizar</a>
</div>
</div>
</div>
<script>
$(function() {
$("#fechamostrara_edit").datepicker({format: "dd-mm-yyyy", orientation:"bottom", autoclose: true});
$("#fechamostrara_edit").change(function(event) {
var fechamostrara_edit = $("#fechamostrara_edit").val();
fechamostrara_edit = fechamostrara_edit.split("-").reverse().join("-");
$("#fecha_edit").val(fechamostrara_edit);
});
});
</script>
And this is mat.js
function EditarMatricula(){
var id = $("#ideditar").val();
var fecha_edit = $("#fecha_edit").val();
var idalumno_edit = $("#idalumno_edit").val();
var idperiodo_edit = $("#idperiodo_edit").val();
var idgrado_edit = $("#idgrado_edit").val();
var idalula_edit = $("#idaula_edit").val();
var tipo_edit = $("input[name='tipo_edit']:checked").val();
var turno_edit = $("input[name='turno_edit']:checked").val();
$.ajax({
type: 'POST',
url: 'class/matriculaeditar.php',
data: {ideditar:id, fecha_edit:fecha_edit, idalumno_edit:idalumno_edit, idperiodo_edit:idperiodo_edit, idgrado_edit:idgrado_edit, idaula_edit:idaula_edit, tipo_edit:tipo_edit, turno_edit:turno_edit },//parametros
success: function(data){
$(".mensajeeditar").hide();
$(".mensajeeditar").html("<div class='smseditar'> SE ACTUALIZO LOS DATOS <br> De la Matrícula</div>");
$('.mensajeeditar').fadeIn('slow');
ListarMatriculas();
}
}).done(function() {
$(".mensajeeditar").fadeOut( 4000, "linear");
$("div").removeClass('modal-backdrop');
$('#myModal-Edit').modal('hide');
$('html, body').animate({ scrollTop: 0 }, 0);
});
}
function ListarMatriculas(){
$.ajax({
url: 'matricula_lista.php',
type: 'GET',
success: function(data){
$("#miTabla").html(data);
$("#miTabla").hide();
$("#miTabla").fadeToggle('slow','linear');
}
});
}

JQUERY AJAX POST ERROR 500 any idea? I'm trying to insert records into

CODEIGNITER METHOD
public function agregar_post(){
$nombre = $this->post('nombre');
$mail = $this->post('mail');
$telefono = $this->post('telefono');
$password = $this->post('password');
$nivel_listado = $this->post('nivel_listado');
// Store he whole data into $data
$data = array(
'id' => '',
'nombre' => $nombre,
'mail' => $mail,
'telefono' => $telefono,
'password' => $password,
'api_key' => '',
'nivel_listados' => $nivel_listado
);
$query = $this->db->insert('cliente',$data);
// Check if insert is succes
if ($query)
{
$this->output->set_header("Access-Control-Allow-Origin: http://www.verdulero.com", false); // header allow
$this->response($query,201);
}else
{
$this->response(null,404);
}
}
//JQUERY AJAX
$("#frmAddClient").submit(function (event){
event.preventDefault();
var dataForm = $(this).serialize();
// ajax to insert a new product
$.ajax({
type: $(this).attr('method'), // METHOD FROM FORM
url: $(this).attr('action'), // URL FROM FORM
crossDomain: true,
data: dataForm,
success: function(){
alert();
}
});
// CLEAN THE FORM AFTER INSERT
$("#frmAddClient")[0].reset();
});
// HTML
<form name="frmAddClient" id="frmAddClient" method="post" action="<?= $addClient ?>" class="form-horizontal">
<div class="form-group">
<label for="Email" class="col-sm-4 control-label">Correo electronico:</label>
<div class="col-sm-4">
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
<input type="text" class="form-control" id="Email" name="mail" placeholder="Verdulero#example.com" value="" autofocus required>
</div>
</div>
</div>
<div class="form-group">
<label for="Nombre" class="col-sm-4 control-label">Nombre:</label>
<div class="col-sm-4">
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
<input type="text" class="form-control" id="Nombre" name="nombre" placeholder="Juan Verdura" value="" required>
</div>
</div>
</div>
<div class="form-group">
<label for="Telefono" class="col-sm-4 control-label">Telefono:</label>
<div class="col-sm-4">
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-phone-alt"></span></span>
<input type="text" class="form-control" id="Telefono" name="telefono" placeholder=" 555 555 555" value="" required>
</div>
</div>
</div>
<div class="form-group">
<label for="Password" class="col-sm-4 control-label">Password:</label>
<div class="col-sm-4">
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
<input type="password" class="form-control" id="Password" name="password" placeholder="Password" value="" required>
</div>
</div>
</div>
<div class="form-group">
<label for="nivel_listado" class="col-sm-4 control-label">Nivel Listado:</label>
<div class="col-sm-4">
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
<select class="form-control" name='nivel_listado' id='nivel_listado'>
<option value=''>Elija</option>
<option value='1'>Usuario nivel 1</option>
<option value='2'>Usuario nivel 2</option>
<option value='3'>Usuario nivel 3</option>
<option value='4'>Nivel administrador</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-4 col-sm-6">
<input type="submit" class="btn btn-success" name="submit" id="Submit_User" value="Insertar nuevo usuario"/>
</div>
</div>
</form>
Use $this->input->post() instead of $this->post()
$nombre = $this->input->post('nombre');
$mail = $this->input->post('mail');
$telefono = $this->input->post('telefono');
$password = $this->input->post('password');
$nivel_listado = $this->input->post('nivel_listado');

Running a php code after script been successfully executed

I have the following script
<script type="text/javascript">
// This identifies your website in the createToken call below
Stripe.setPublishableKey('');
var stripeResponseHandler = function(status, response) {
var $form = $('#payment-form');
if (response.error) {
// Show the errors on the form
$form.find('.payment-errors').text(response.error.message);
$form.find('button').prop('disabled', false);
} else {
// token contains id, last4, and card type
var token = response.id;
var appendedStripeToken = false;
// Insert the token into the form so it gets submitted to the server
$form.append($('<input type="text" name="stripeToken" />').val(token);
function handleCall() {
if (!appendedStripeToken) {
appendedStripeToken = true;
phpCall();
}
} // and re-submit
}
};
function onSubmit() {
var $form = $('#'+id_from_form);
// Disable the submit button to prevent repeated clicks
$form.find('input').prop('disabled', true);
Stripe.card.createToken($form, stripeResponseHandler);
}
function phpCall() {
$.ajax({
url: 'paymentEmail.php',
success: function (response) {//response is value returned from php (for your example it's "bye bye"
alert(response);
}
});
}
</script>
Essentially the phpCall() should only execute after
$form.append($('<input type="text" name="stripeToken" />').val(token);
to be executed again, the user would have to refresh or land on the page, and hit the submit button again.
The problem here is that when a user hit submit, then the php code gets executed, which is great but when the page refresh or user relands on the page the php code gets executed regardless if the submit button was clicked.
Below is the php code, where I would like to store the value of this input and post it on the php page
<input type="text" name="stripeToken" />
php page:
<?php
$course_price_final = $_POST['course_price_final'];
$course_token = $_POST['stripeToken'];
$course_provider = $_POST['course_provider'];
$user_email = $_POST['user_email'];
$course_delivery = $_POST['course_delivery'];
$order_date = date("Y-m-d");
$insert_c = "insert into orders (course_title,course_price_final,course_provider,user_email,course_date,course_delivery,order_date,course_token)
values ('$crs_title','$course_price_final','$course_provider','$user_email','$course_date1','$course_delivery','$order_date','$course_token')";
$run_c = mysqli_query($con, $insert_c);
Update:
<script type="text/javascript">
// This identifies your website in the createToken call below
Stripe.setPublishableKey('CODE');
var appendedStripeToken = false;
var stripeResponseHandler = function(status, response) {
var $form = $('#payment-form');
if (response.error) {
// Show the errors on the form
$form.find('.payment-errors').text(response.error.message);
$form.find('button').prop('disabled', false);
} else {
// token contains id, last4, and card type
var token = response.id;
handleCall(token);
}
};
function handleCall(token) {
if (!appendedStripeToken) {
// Insert the token into the form so it gets submitted to the server
$form.append($('<input type="text" name="stripeToken" />').val(token);
appendedStripeToken = true;
phpCall();
}
}
function onSubmit() {
var $form = $('#payment-form'); // TODO: give your html-form-tag an "id" attribute and type this id in this line. IMPORTANT: Don't replace the '#'!
// Disable the submit button to prevent repeated clicks
$('#paymentSubmit').prop('disabled', true); // TODO: give your html-submit-input-tag an "id" attribute
Stripe.card.createToken($form, stripeResponseHandler);
}
function phpCall() {
$.ajax({
url: 'paymentEmail.php',
success: function (response) { // response is value returned from php (for your example it's "bye bye")
alert(response);
}
});
}
</script>
</head>
<body>
<form action="" method="POST" id="payment-form" class="form-horizontal">
<div class="row row-centered">
<div class="col-md-4 col-md-offset-4">
<div class="alert alert-danger" id="a_x200" style="display: none;"> <strong>Error!</strong> <span class="payment-errors"></span> </div>
<span class="payment-success">
<? $success ?>
<? $error ?>
</span>
<fieldset>
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Choose Start Date</label>
<div class="col-sm-6">
<select name="course_date" class="address form-control" required>
<option><?php
if(isset($_GET['crs_id'])){
$course_id = $_GET['crs_id'];
$get_crs = "select * from courses where course_id='$course_id'";
$run_crs = mysqli_query($con, $get_crs);
while($row_crs=mysqli_fetch_array($run_crs)){
$course_date1 = $row_crs['course_date1'];
echo $course_date1 ;
}
}
?></option>
<option value=<?php
if(isset($_GET['crs_id'])){
$course_id = $_GET['crs_id'];
$get_crs = "select * from courses where course_id='$course_id'";
$run_crs = mysqli_query($con, $get_crs);
while($row_crs=mysqli_fetch_array($run_crs)){
$course_provider = $row_crs['course_provider'];
$course_date2 = $row_crs['course_date2'];
$course_price = $row_crs['course_price'];
$course_title = $row_crs['course_title'];
$course_priceFinal = $row_crs['course_priceFinal'];
$dig = explode(".", $row_crs['course_tax']);
$course_tax = $dig[1];
echo $course_date2 ;
}
}
?>/>
</select>
</div>
</div>
<input type="hidden" name="course_provider" value="<?php echo $course_provider; ?>" >
<input type="hidden" name="course_title" value="<?php echo $course_title; ?>" >
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Course Delivery</label>
<div class="col-sm-6">
<select name="course_delivery" class="address form-control" required>
<option value="classroom">Classroom</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Seats</label>
<div class="col-sm-6">
<select name="course_seats" class="address form-control" required>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
</div>
<!-- Form Name -->
<legend>Billing Details</legend>
<!-- Street -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Billing Street</label>
<div class="col-sm-6">
<input type="text" name="street" placeholder="Street" class="address form-control" required>
</div>
</div>
<!-- City -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Billing City</label>
<div class="col-sm-6">
<input type="text" name="city" placeholder="City" class="city form-control" required>
</div>
</div>
<!-- State -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Billing Province</label>
<div class="col-sm-6">
<input type="text" name="province" maxlength="65" placeholder="Province" class="state form-control" required>
</div>
</div>
<!-- Postcal Code -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Postal Code</label>
<div class="col-sm-6">
<input type="text" name="postal" maxlength="9" placeholder="Postal Code" class="zip form-control" required>
</div>
</div>
<!-- Country -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Country</label>
<div class="col-sm-6">
<input type="text" name="country" placeholder="Country" class="country form-control">
<div class="country bfh-selectbox bfh-countries" name="country" placeholder="Select Country" data-flags="true" data-filter="true"> </div>
</div>
</div>
<!-- Email -->
<?php
$email = $_GET['user_email'];
// Note the (int). This is how you cast a variable.
$coupon = isset($_GET['crs_coupon']) ? (int)$_GET['crs_coupon'] : '';
if(is_int($coupon)){
$course_priceFinalAll = $course_priceFinal - ($course_priceFinal * ($coupon/100));
$coupon_deduction = $course_priceFinal * ($coupon/100);
};
?>
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Email</label>
<div class="col-sm-6">
<input type="text" name="user_email" value=<?php echo $email; ?> class="email form-control" required>
<input type="hidden" name="course_title" value=<?php echo $course_title; ?> class="email form-control">
<input type="hidden" id="box1" name="course_price" value=<?php echo $course_priceFinal; ?> class="email form-control">
</div>
</div><br>
<legend>Purchase Details</legend>
<div class="form-group">
<label class="col-sm-4 control-label">Coupon Code</label>
<div class="col-sm-6">
<input type="text" style="text-align:left; float:left; border:none; width:100px;" name="name" class="email form-control" placeholder="Coupon Code" value="<?php echo $coupon; ?>%" readonly>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label">Want to replace the current coupon code?</label>
<div class="col-sm-6">
<input type="text" name="name" class="email form-control" placeholder="Please enter another coupon code" value="">
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label" style="color:#FF6400; font-weight:normal;">Tax</label>
<div class="col-sm-6">
<input type="text" class="email form-control" name="name"style="text-align:left; float:left; border:none; width:100px;" placeholder="Please enter another coupon code" value=" <?php echo $course_tax; ?>%" readonly>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label" style="color:#FF6400;font-weight:normal;">Price before Tax</label>
<div class="col-sm-6">
<input type="text" style="text-align:left; float:left; border:none; width:100px;" name="course_price_before_tax" class="email form-control" value=" $<?php echo $course_price; ?>" readonly>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label" style="color:#FF6400; font-weight:normal;">Price After Tax</label>
<div class="col-sm-6">
<input type="text" style="text-align:left; float:left; border:none; width:100px;" name="course_price_after_tax" class="email form-control" value=" $<?php echo $course_priceFinal; ?>" readonly>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label" style="color:#FF6400; font-weight:normal;">Coupon Deduction</label>
<div class="col-sm-6">
<input type="text" style="text-align:left; float:left; border:none; width:100px;" name="course_deduction" class="email form-control" value=" -$<?php echo $coupon_deduction; ?>" readonly>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label" style="color:#FF6400"><b>Final Price</b></label>
<div class="col-sm-6">
<input type="text" style="text-align:left; font-weight:bold; float:left; border:none; width:100px;" name="course_price_final" class="email form-control" placeholder="Course Price Final" value="$<?php echo $course_priceFinalAll; ?>" readonly>
</div>
</div>
<!-- Coupon Code-->
<input type="hidden" name="coupon_code" class="email form-control" placeholder="Coupon Code" value=<?php echo $coupon; ?> readonly>
<!-- Price Final -->
<br>
<fieldset>
<legend>Card Details</legend>
<span class="payment-errors"></span>
<!-- Card Holder Name -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Card Holder's Name</label>
<div class="col-sm-6">
<input type="text" name="cardholdername" maxlength="70" placeholder="Card Holder Name" class="card-holder-name form-control" required>
</div>
</div>
<!-- Card Number -->
<div class="form-group">
<label class="col-sm-4 control-label" for="textinput">Card Number</label>
<div class="col-sm-6">
<input type="text" id="cardnumber" maxlength="19" data-stripe="number" placeholder="Card Number" class="card-number form-control" required>
</div>
</div>
<div class="form-row">
<label class="col-sm-4 control-label">CVC</label>
<div class="col-sm-6">
<input type="text" size="4" class="email form-control" data-stripe="cvc" required/>
</div>
</div>
<br>
<div class="form-row"><br><br>
<label class="col-sm-4 control-label">Expiration (MM/YYYY)</label>
<div class="col-sm-6">
<div class="form-inline">
<select name="select2" data-stripe="exp-month" class="card-expiry-month stripe-sensitive required form-control" required>
<option value="01" selected="selected">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
</div>
<input type="text" size="4" class="email form-control" data-stripe="exp-year" required/>
</div>
</div>
<br>
<!-- Submit -->
<div class="control-group">
<div class="controls">
<center><br>
<input id="paymentSubmit" class="btn btn-danger" name="paid" onClick="onSubmit()" type="submit" value="Pay Now" class="btn btn-success"></button>
</center>
</div>
</div>
</fieldset>
</form>
update 2
two minor issues: With the button being disabled after a click, it wont allow to click again if for instance an error is returned as shown above. It should only disable it after the input has been released
$form.append($('').val(token));
Try sending a variable via POST to your PHP:
function phpCall() {
$.ajax({
type: "POST",
data: {run: true},
url: 'paymentEmail.php',
success: function (response) {//response is value returned from php (for your example it's "bye bye"
alert(response);
}
});
}
And then in your php:
if ($_POST['run']) {
$course_price_final = $_POST['course_price_final'];
$course_token = $_POST['stripeToken'];
$course_provider = $_POST['course_provider'];
$user_email = $_POST['user_email'];
$course_delivery = $_POST['course_delivery'];
$order_date = date("Y-m-d");
$insert_c = "insert into orders (course_title,course_price_final,course_provider,user_email,course_date,course_delivery,order_date,course_token)
values ('$crs_title','$course_price_final','$course_provider','$user_email','$course_date1','$course_delivery','$order_date','$course_token')";
$run_c = mysqli_query($con, $insert_c);
}
It might help you :
function phpCall() {
if( appendedStripeToken === true ){
$.ajax({
type: "POST",
data: {run: true},
url: 'paymentEmail.php',
success: function (response) {//response is value returned from php (for your example it's "bye bye"
alert(response);
}
});
}
}

Categories

Resources