Develop Reference

Stepformwizard is not getting hidden. Overflowing on right of the screen

Am not very expert in jquery and stepformwizard. Am working on code written by someone else. The issue is the multistepformwizard fieldset is used and the next step should be loaded only when Next button is clicked. But currently both of the steps are visible on the screen with extra horizontal scrollbar. I dont want the step 2 form to be visible. Here is the html and jquery code.
<div class="ztab-sec ztab-desbrd bksrvsec bksecrv2">
<div class="row">
<div class="col-md-12">
<form action="<?php echo base_url()?>service/service_request" method="POST" id="wizard_example_6" autocomplete="off">
<input type="hidden" value="<?php echo $ownerArr[0]['email_id']; ?>" name="email_id">
<input type="hidden" value="<?php echo $ownerArr[0]['phone']; ?>" name="mobile">
<fieldset>
<legend>Basic information about your car</legend>
<div class="row bkmargin">
<div class="col-lg-4 col-sm-4">
<div class="form-group">
<label>Vehicle Brand</label>
<select id="u_car_id" class="form-control" name="car_id" required>
<option selected disabled value="">Select a Car</option>
<?php foreach ($cars as $car_details) : ?>
<option value="<?php echo $car_details['user_car_id']; ?>"><?php echo $car_details['makesTitle']; ?> (<?php echo $car_details['modelsTitle']; ?>) <?php echo $car_details['car_reg_no']; ?></option>
<?php endforeach; ?>
</select>
</div>
</div>
<div class="col-lg-4 col-sm-4">
<div class="form-group">
<label>Variants</label>
<input type="text" class="form-control" name="variant" placeholder="Variants" required data-parsley-group="block0" id="variant" readonly pattern="^[a-zA-Z\s]*$">
</div>
</div>
<div class="col-lg-4 col-sm-4">
<div class="form-group">
<label>Transmission</label>
<input type="text" class="form-control" placeholder="Transmission" name="transmission" readonly required data-parsley-group="block0" id="transmission" pattern="^[a-zA-Z\s]*$">
</div>
</div>
</div>
<legend class="clearfix">Select service for your car? <a href="#" class="car-link pull-right" data-toggle="modal" data-target="#myModal3" >Add New Car</a></legend>
<div class="row bkmargin">
<div class="col-md-4 col-sm-4">
<div class="form-group besrvx">
<input id="option-one" name="service_type" value="1" class="styled-radio " type="radio" data-parsley-group="block0" required data-required-message="Please check one service">
<label class="srvlabel" id="1" for="option-one"><strong>Basic Service: </strong>
<span class="srvspa">3 months or 5000 kms (whichever is earlier)</span>
</label>
</div>
</div>
</fieldset>
<fieldset>
<legend>Vehicle picked up address </legend>
<div class="row bkmargin">
<div class="col-lg-4 col-sm-4">
<div class="form-group">
<label>Select Address</label>
<select class="form-control" id="user_add_id" name="pick_id">
<option selected disabled>Select Address</option>
<?php $i=1; foreach ($address as $user_details) : ?>
<option value="<?php echo $user_details['add_id'] ?>"> Address <?php echo $i; ?></option>
<?php $i++; endforeach; ?>
<option id="neww" class="neww" value="neww">Select new Address</option>
</select>
</div>
</div>
<div class="col-lg-4 col-sm-4">
<div class="form-group">
<label>Address Type</label>
<select class="form-control" id="add_type" name="add_type" disabled>
<option value="" selected disabled>Select Address Type</option>
<option value="Home">Home Address</option>
<option value="Office">Office Address</option>
<option value="Other">Other Address</option>
</select>
</div>
<div class="row bkmargin">
<noscript>
<input class="nocsript-finish-btn sf-right nocsript-sf-btn" type="submit" value="submit"/>
</noscript>
</div>
</fieldset>
</form>
I have skipped some part as its a long form. I want the second fieldset should only be visible when user clicks on next button
here is the jquery
w6 = $("#wizard_example_6").stepFormWizard({
onNext: function(b, a) {
return $("#wizard_example_6").parsley().validate("block" + b)
},
onFinish: function(b) {
return $("#wizard_example_6").parsley().validate()
}
});
var d = window.location.hash.match(/^#step-(\d+)/),
c = 0;
null !== d && (c = d[1] - 1);
w7 = $("#wizard_example_7").stepFormWizard({
startStep: c,
onNext: function(b, a) {
window.location.hash = "#step-" + (b + 2)
},
onPrev: function(b, a) {
window.location.hash = "#step-" + b
},
onFinish: function(b) {
window.location.hash = "#form-sended"
}
})
};
$(document).ready(function() {
prepare_example();
$("pre code").each(function(c, b) {
hljs.highlightBlock(b)
});
var d = $(location).attr("search").match(/t=([a-z]+)/);
"undefined" != typeof d && null != d ? ($(".sf-wizard").parent().removeClass("sf-sea").addClass("sf-" + d[1]), $(".bt-" + d[1]).removeClass("btn-default").addClass("btn-info")) : $(".bt-sea").removeClass("btn-default").addClass("btn-info")
});
Please help me with this. I have tried using but no luck also changed css display:none inplace of block but couldnt resolve the issue.

Dynamic display of Html div with php expression using javascript on button click

please help me with my problem, been cranking my head for this one, so basically I want to dynamically add a <div> with form elements on it. I want to append it on button click using javascript. I had it working at first until the part where I have to place a php expression on the <select> tag in the labels and values of the select option comes from my database.
HTML
<div id="file-container" class="container-fluid">
<div class="form-inline thumbnail">
<label class="sr-only">File Name</label>
<input type="text" class="form-control input-sm" name="filename[]" placeholder="File name *">
<select class="selectpicker" data-live-search="true" title="Choose Article" name="article[]">
<?php while($row_rsArticles = mysqli_fetch_assoc($rsArticles)){ ?>
<option value="<?php echo $row_rsArticles['id']; ?>" ><?php echo $row_rsArticles['name']; ?></option>
<?php } mysqli_data_seek($rsArticles, 0);?>
</select>
<div class="radio">
<fieldset id="group1">
<label class="radio"><input type="radio" class="radio" name="filemode[] id=group1" value="0">Can View</label>
<label class="radio"><input type="radio" class="radio" name="filemode[] id=group1" value="1">Can Download</label>
</fieldset>
</div>
<label for="fileinput" class="sr-only">File input</label>
<input type="file" class="form-control input-sm" name="fileinput[]">
<button type="button" class="btn btn-danger" id="deletefileinput">Delete</button>
</div>
SQL
mysqli_select_db($connection, $database);
$query_rsArticles = "SELECT * FROM article order by name asc";
$rsArticles = mysqli_query($connection, $query_rsArticles) or die("Error in retrieving article records");
$totalRows_rsArticles = mysqli_num_rows($rsArticles);
JAVASCRIPT
$(function() {
var counter = 2;
$('#addfileinput').click(function(){
var newDiv = $('<div class="form-inline thumbnail"><label class="sr-only">File Name</label><input type="text" class="form-control input-sm" name="filename[]" placeholder="File name *"><select class="selectpicker" data-live-search="true" title="Choose Article" name="article[]"><?php while($row_rsArticles = mysqli_fetch_assoc($rsArticles)){ ?><option value="<?php echo $row_rsArticles['id']; ?>" ><?php echo $row_rsArticles['name']; ?></option><?php } mysqli_data_seek($rsArticles, 0);?></select><div class="radio"><fieldset id="group'+counter+'"><label class="radio"><input type="radio" class="radio" name="filemode[] id=group'+counter+'" value="0">Can View</label><label class="radio"><input type="radio" class="radio" name="filemode[] id=group'+counter+'" value="1">Can Download</label></fieldset></div><label for="fileinput" class="sr-only">File input</label><input type="file" class="form-control input-sm" name="fileinput[]"><button type="button" class="btn btn-danger" id="deletefileinput">Delete</button></div>').append(newDiv);
counter ++;
});
});

I think ajax is the way to go. Try this approach...
HTML
<div id="file-container" class="container-fluid">
<div class="form-inline thumbnail">
<form id="articles_search">
<label class="sr-only">File Name</label>
<input id= "srch_input" type="text" class="form-control input-sm" name="filename[]" placeholder="File name *">
<button class = "btn btn-default" id="articles">Ajax</button>
</form>
<div id="srch">
</div>
<div class="radio">
<fieldset id="group1">
<label class="radio"><input type="radio" class="radio" name="filemode[] id=group1" value="0">Can View</label>
<label class="radio"><input type="radio" class="radio" name="filemode[] id=group1" value="1">Can Download</label>
</fieldset>
</div>
<label for="fileinput" class="sr-only">File input</label>
<input type="file" class="form-control input-sm" name="fileinput[]">
<button type="button" class="btn btn-danger" id="deletefileinput">Delete</button>
JAVASCRIPT
$(document).ready(function() {
$('#articles').click(function(){
var title = $("#srch_input").val();
$.ajax({
url: 'processing_php_file.php',
type: "POST",
data: {'title': $("#srch_input").val()},
processData: true,
success: function(data){
$('#srch').fadeIn(200).html(data);
},
error: function(){
}
});
});
PHP
Name of the php file should be processing_php_file.php.
<?php
mysqli_select_db($connection, $database);
$query_rsArticles = "SELECT * FROM article order by name asc";
$rsArticles = mysqli_query($connection, $query_rsArticles) or
die("Error in retrieving article records");
$totalRows_rsArticles = mysqli_num_rows($rsArticles);
while($row_rsArticles = mysqli_fetch_assoc($rsArticles));
echo '<select>';
for ($i=0; $i <sizeof($totalRows_rsArticles) ; $i++) {
echo '<option>';
echo $row_rsArticles['id'];
echo $row_rsArticles['name'];
echo '</option>';
}
echo '</select>';
?>
In this example we are querying the database via ajax call and retrieving the data from the database and showing them in the web page without page refresh.
note: You need to modify your php according to your need. I just used the code provided by you as it is just to show you the approach. I added the echo part to show the result in your webpage. You can optimize the look by css.
Hope this helps!

Passing Form ID variable to echo function within javascript

I am unable to pass the form id variable to javascript
where the date input = mm/dd/yyyy with selection of dropdown text A and text B should populate the JS output
$('#Option').change(function(){
if ($(this).val()== 'A') {
$('#text1').val('3');
$('#text2').val("<?php echo date('m/d/Y', strtotime($myDate . ' +1 Weekdays')); ?>");
} else if ($(this).val()== 'B') {
$('#text1').val('8');
$('#text2').val("<?php echo date('m/d/Y', strtotime($myDate . ' +8 Weekdays')); ?>");
}
});
<div class="col-xs-3">
<label class="control-label" placeholder="mm/dd/yyyy">Date</label>
<input type="text" class="form-control" id="Date" name="Date" />
</div>
<div class="col-xs-3">
<label class="control-label">Option</label>
<select class="form-control" id="Option" name="Option">
<option value="">Select</option>
<option value="A" >A</option>
<option value="B" >B</option>
</select>
</div>
<div class="col-xs-3">
<label class="control-label">Text1</label>
<input type="text" class="form-control" id="Text1" name="Text1" />
</div>
<div class="col-xs-3">
<label class="control-label">Text2</label>
<input type="text" class="form-control" id="Text2" name="Text2" />
</div>
https://jsfiddle.net/hufuso0d/3/

The ids are Text1 and Text2. Try as below :
<script>
$('#Option1').change(function(){
if ($(this).val()== 'A') {
$('#Text1').val('3');
$('#Text2').val("<?php echo date('m/d/Y', strtotime($myDate . ' +1 Weekdays')); ?>");
} else if ($(this).val()== 'B') {
$('#Text1').val('8');
$('#Text2').val("<?php echo date('m/d/Y', strtotime($myDate . ' +8 Weekdays')); ?>");
}
});
</script>

It works!
Pay attention to the correct id: you should insert
$('#Text1').val('3');
instead of
$('#text1').val('3');

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);
}
});
}
}

How to pass a variable from a page to other in php

I have a page *book_order*,which is used to add orders into a table *order_management*, where order_id is auto incremented in that table. once after submit this page i want the order_id to be passed to other page *book_order2* to add products under same order_id. For that i have created seperete *order_management2* table in which order_id is not auto-incremented.
My requirement is that i want to pass order_id from book_order page to book_order2 page and that variable is to be remembered till i do keep on adding....if i want to add new order, i will go to book_order page, else i will use book_order2 page.
book_order.php
<div class="grid_4">
<div class="da-panel">
<div class="da-panel-header">
<span class="da-panel-title">
<img src="images/icons/color/wand.png" alt="" />
<font face="Cambria" size="7" color="#009900"><b>Book Order</b></font>
</span>
</div>
<div class="da-panel-toolbar top">
<ul>
<li><div class="da-button blue large">View all Orders</div></li>
</ul>
</div>
<div class="da-panel-content">
<?php
if(isset($_POST['submit']))
{
extract($_POST);
$order_date=date("Y-m-d");
$sql=mysql_query("select sku,quantity_in_stock,sold_quantity,crdate from stock_info where product_name = '$prod'");
$array=mysql_fetch_array($sql);
$sku = $array[0];
$qis = $array[1];
$sold_quan = $array[2];
$crdate = $array[3];
$sql2=mysql_query("INSERT INTO order_management(order_date,brand,product,price,customer_name,phone_number,email,address,quantity,channel,courier,order_status,sku)
VALUES
('$order_date','$brand','$prod','$pri','$customername','$phonenumber', '$email','$address','$quantity','$channel','$courier','booked','$sku')");
if($sql2)
{
echo "<div class='da-message success'>Successfully Booked Your Order</div>";
?>
<script>
var r = confirm("want to add more products?");
if (r == true)
{
//x="You pressed OK!";
window.location = "main.php?page=book_order2";
}
else
{
//x="You pressed Cancel!";
window.location = "main.php";
}
</script>
<?php
}
else
{
die(mysql_error());
}
$quantity_left = $qis - $quantity;
$sold_quan = $sold_quan + $quantity;
$diff_in_days = (strtotime($order_date) - strtotime($crdate))/(60 * 60 * 24);
$expctd_stock=round((7*$quantity_left)/$diff_in_days);
//echo $expctd_stock;
$sql3 =mysql_query("UPDATE stock_info SET quantity_in_stock = '$quantity_left',last_sold_date='$order_date', sold_quantity='$sold_quan', expected_stock='$expctd_stock' WHERE sku='$sku'");
/*$sql3 = mysql_query("update order_management set sku='$sku' where order_date=''");*/
$sql4 =mysql_query("select order_id from order_management where sku='$sku'");
$idarray=mysql_fetch_array($sql4);
$id = $idarray[0];
//$_SESSION['id'] = $id;
}
?>
<form id="da-ex-validate1" class="da-form" method="post" action="">
<div class="da-form-row">
<label>Brand<span class="required">*</span></label>
<div class="da-form-item small">
<!--<input type="text" name="brand" id="brand" class="required" value=""/>-->
<select name="brand" id="brand" onChange="retrievedata(this.value)">
<option value="">--- select brand ---</option>
<?php
$ord=mysql_query("select * from brand_info");
while($ord1=mysql_fetch_array($ord))
{
?>
<option value="<?php echo $ord1['brand'];?>"><?php echo $ord1['brand'];?></option>
<?php
}
?>
</select>
</div>
</div>
<div class="da-form-row">
<label>Product<span class="required">*</span></label>
<div class="da-form-item small">
<select name="prod" id="prod" onChange="retrievequantity(this.value)">
<option value="">--- select product ---</option>
</select>
</div>
</div>
<div class="da-form-row">
<label>Customer name<span class="required">*</span></label>
<div class="da-form-item small">
<input type="text" name="customername" id="customername" class="required char" value=""/>
</div>
</div>
<div class="da-form-row">
<label>Phone Number<span class="required">*</span></label>
<div class="da-form-item small">
<input type="text" name="phonenumber" id="phonenumber" class="required number" value=""/>
</div>
</div>
<div class="da-form-row">
<label>Email<span class="required">*</span></label>
<div class="da-form-item small">
<input type="text" name="email" id="email" class="required email" value=""/>
</div>
</div>
<div class="da-form-row">
<label>Address<span class="required">*</span></label>
<div class="da-form-item small">
<textarea name="address" id="address" class="required"></textarea>
</div>
</div>
<div class="da-form-row">
<label>Quantity<span class="required">*</span></label>
<div class="da-form-item small">
<select name="quantity" id="quantity">
<option value=""> --- select Quantity--- </option>
</select>
</div>
</div>
<div class="da-form-row">
<label>Total Price<span class="required">*</span></label>
<div class="da-form-item small">
<input type="text" name="pri" id="pri" class="required number" value=""/>
</div>
</div>
<div class="da-form-row">
<label>Courier<span class="required"></span></label>
<div class="da-form-item small">
<!--<input type="text" name="courier" id="courier" class="required" value=""/>-->
<select name="courier" id="courier">
<option value=""> ---select courier --- </option>
<?php
$ord=mysql_query("select courier_name from courier_info");
while($ord1=mysql_fetch_array($ord))
{
?>
<option value="<?php echo $ord1['courier_name'];?>"><?php echo $ord1['courier_name'];?></option>
<?php
}
?>
</select>
</div>
</div>
<div class="da-form-row">
<label>Channel<span class="required"></span></label>
<div class="da-form-item small">
<!--<input type="text" name="channel" id="channel" class="required" value=""/>-->
<select name="channel" id="channel">
<option value=""> --- select channel ---</option>
<?php
$ord=mysql_query("select channel from channel_info");
while($ord1=mysql_fetch_array($ord))
{
?>
<option value="<?php echo $ord1['channel'];?>"><?php echo $ord1['channel'];?></option>
<?php
}
?>
</select>
</div>
</div>
<div class="da-button-row">
<input type="submit" name="submit" value="submit" class="da-button grey" />
</div>
</fieldset>
</form>
</div>
<!-- End of .grid_4 --> </div>
</div>
<script>
function retrievedata(data)
{
var option_html = "";
<?php
$sql=mysql_query("SELECT distinct brand,product_name FROM stock_info");
while($ord1=mysql_fetch_array($sql))
{
?>
if(data == '<?php echo $ord1['brand']; ?>')
{
option_html += "<option><?php echo $ord1['product_name']; ?></option>";
/*alert(option_html);*/
}
<?php
}
?>
var par = document.getElementById("prod");
par.innerHTML = "<option>--- select product ---</option>"+option_html;
}
function retrievequantity(product)
{
var option_quantity_html = "";
<?php
$sql=mysql_query("SELECT product_name, quantity_in_stock FROM stock_info");
while($ord2=mysql_fetch_array($sql))
{
$i=1;
?>
if(product == '<?php echo $ord2['product_name']; ?>')
{
<?php
while($i<=intval($ord2['quantity_in_stock'])){?>
option_quantity_html += "<option><?php echo $i++; ?></option>";
<?php }?>
}
<?php
}
?>
var par = document.getElementById("quantity");
par.innerHTML = option_quantity_html;
}
</script>
book_order2.php
<?php /*?><?php
$id = $_SESSION['id'];
echo $id;
?><?php */?>
<?php
include("includes/db.php");
?>
<div class="grid_4">
<div class="da-panel">
<div class="da-panel-header">
<span class="da-panel-title">
<img src="images/icons/color/wand.png" alt="" />
<font face="Cambria" size="7" color="#009900"><b>Book Order</b></font>
</span>
</div>
<div class="da-panel-toolbar top">
<ul>
<li><div class="da-button blue large">View all Orders</div></li>
</ul>
</div>
<div class="da-panel-content">
<?php
if(isset($_POST['submit']))
{
extract($_POST);
$order_date=date("Y-m-d");
$sql=mysql_query("select sku,quantity_in_stock,sold_quantity,crdate from stock_info where product_name = '$prod'");
$array=mysql_fetch_array($sql);
$sku = $array[0];
$qis = $array[1];
$sold_quan = $array[2];
$crdate = $array[3];
$sql2=mysql_query("INSERT INTO order_management2(order_id,order_date,brand,product,price,customer_name,phone_number,email,address,quantity,channel,courier,order_status,sku)
VALUES
('$id','$order_date','$brand','$prod','$pri','$customername','$phonenumber', '$email','$address','$quantity','$channel','$courier','booked','$sku')");
if($sql2)
{
echo "<div class='da-message success'>Successfully Booked Your Order</div>";
?>
<script>
var r = confirm("want to add more products?");
if (r == true)
{
//x="You pressed OK!";
window.location = "main.php?page=book_order2";
}
else
{
//x="You pressed Cancel!";
window.location = "main.php";
}
</script>
<?php
}
else
{
die(mysql_error());
}
$quantity_left = $qis - $quantity;
$sold_quan = $sold_quan + $quantity;
$diff_in_days = (strtotime($order_date) - strtotime($crdate))/(60 * 60 * 24);
$expctd_stock=round((7*$quantity_left)/$diff_in_days);
//echo $expctd_stock;
$sql3 =mysql_query("UPDATE stock_info SET quantity_in_stock = '$quantity_left',last_sold_date='$order_date', sold_quantity='$sold_quan', expected_stock='$expctd_stock' WHERE sku='$sku'");
/*$sql3 = mysql_query("update order_management set sku='$sku' where order_date=''");*/
//$sql4 =mysql_query("select order_id from order_management where sku='$sku'");
//$idarray=mysql_fetch_array($sql4);
}
?>
<form id="da-ex-validate1" class="da-form" method="post" action="">
<div class="da-form-row">
<label>Brand<span class="required">*</span></label>
<div class="da-form-item small">
<!--<input type="text" name="brand" id="brand" class="required" value=""/>-->
<select name="brand" id="brand" onChange="retrievedata(this.value)">
<option value="">--- select brand ---</option>
<?php
$ord=mysql_query("select * from brand_info");
while($ord1=mysql_fetch_array($ord))
{
?>
<option value="<?php echo $ord1['brand'];?>"><?php echo $ord1['brand'];?></option>
<?php
}
?>
</select>
</div>
</div>
<div class="da-form-row">
<label>Product<span class="required">*</span></label>
<div class="da-form-item small">
<select name="prod" id="prod" onChange="retrievequantity(this.value)">
<option value="">--- select product ---</option>
</select>
</div>
</div>
<div class="da-form-row">
<label>Customer name<span class="required">*</span></label>
<div class="da-form-item small">
<input type="text" name="customername" id="customername" class="required char" value=""/>
</div>
</div>
<div class="da-form-row">
<label>Phone Number<span class="required">*</span></label>
<div class="da-form-item small">
<input type="text" name="phonenumber" id="phonenumber" class="required number" value=""/>
</div>
</div>
<div class="da-form-row">
<label>Email<span class="required">*</span></label>
<div class="da-form-item small">
<input type="text" name="email" id="email" class="required email" value=""/>
</div>
</div>
<div class="da-form-row">
<label>Address<span class="required">*</span></label>
<div class="da-form-item small">
<textarea name="address" id="address" class="required"></textarea>
</div>
</div>
<div class="da-form-row">
<label>Quantity<span class="required">*</span></label>
<div class="da-form-item small">
<select name="quantity" id="quantity">
<option value=""> --- select Quantity--- </option>
</select>
</div>
</div>
<div class="da-form-row">
<label>Total Price<span class="required">*</span></label>
<div class="da-form-item small">
<input type="text" name="pri" id="pri" class="required number" value=""/>
</div>
</div>
<div class="da-form-row">
<label>Courier<span class="required"></span></label>
<div class="da-form-item small">
<!--<input type="text" name="courier" id="courier" class="required" value=""/>-->
<select name="courier" id="courier">
<option value=""> ---select courier --- </option>
<?php
$ord=mysql_query("select courier_name from courier_info");
while($ord1=mysql_fetch_array($ord))
{
?>
<option value="<?php echo $ord1['courier_name'];?>"><?php echo $ord1['courier_name'];?></option>
<?php
}
?>
</select>
</div>
</div>
<div class="da-form-row">
<label>Channel<span class="required"></span></label>
<div class="da-form-item small">
<!--<input type="text" name="channel" id="channel" class="required" value=""/>-->
<select name="channel" id="channel">
<option value=""> --- select channel ---</option>
<?php
$ord=mysql_query("select channel from channel_info");
while($ord1=mysql_fetch_array($ord))
{
?>
<option value="<?php echo $ord1['channel'];?>"><?php echo $ord1['channel'];?></option>
<?php
}
?>
</select>
</div>
</div>
<div class="da-button-row">
<input type="submit" name="submit" value="submit" class="da-button grey" />
<?php /*?><a href="book_order2.php?&id=<?php echo $id; ?>" name="submit" value="submit" class="da-button grey">Book Order</a<?php */?>
</div>
</fieldset>
</form>
</div>
<!-- End of .grid_4 --> </div>
</div>
<script>
function retrievedata(data)
{
var option_html = "";
<?php
$sql=mysql_query("SELECT distinct brand,product_name FROM stock_info");
while($ord1=mysql_fetch_array($sql))
{
?>
if(data == '<?php echo $ord1['brand']; ?>')
{
option_html += "<option><?php echo $ord1['product_name']; ?></option>";
/*alert(option_html);*/
}
<?php
}
?>
var par = document.getElementById("prod");
par.innerHTML = "<option>--- select product ---</option>"+option_html;
}
function retrievequantity(product)
{
var option_quantity_html = "";
<?php
$sql=mysql_query("SELECT product_name, quantity_in_stock FROM stock_info");
while($ord2=mysql_fetch_array($sql))
{
$i=1;
?>
if(product == '<?php echo $ord2['product_name']; ?>')
{
<?php
while($i<=intval($ord2['quantity_in_stock'])){?>
option_quantity_html += "<option><?php echo $i++; ?></option>";
<?php }?>
}
<?php
}
?>
var par = document.getElementById("quantity");
par.innerHTML = option_quantity_html;
}
</script>

You can store the order number in the session. This way, it will be protected and persisted across pages.
When you insert the order in book_order.php, store it in the session:
$sql2=mysql_query(....); // inserting
if($sql2){
$_SESSION['order_id'] = mysql_insert_id();
}
Now, in book_order2.php you can retrieve the order ID before you do the insert of the product:
$id = $_SESSION['order_id'];
// insert product with order_id = $id
In order to use PHP sessions, you must calll session_start() at the beginning of any script that makes use of the session. If you have a global/header include then you can do it there.
Side notes:
mysql_* is deprecated. Consider upgrading to PDO or MySQLi. This is a good PDO tutorial, especially if you're upgrading from mysql_*.
Use a Prepared Statement with bound parameters instead of concatenating variables into SQL.

I would use ajax. For example:
$(document).ready(function()
{
$("form").on('submit',function(event)
{
event.preventDefault();
data = "var=data";
$.ajax
({
type: "GET",
url: "parser.php",
data: data
}).done(function(msg)
{
alert(msg);
});
});
});
It will send GET into parser.php. And the data field would be data in $_GET['var']