How to make a Multi Role for different dashboard - javascript

I want to make a role in one login form for different admin users. But when I try to select finance in the dropdown menu I still get to enter the admin dashboard, not the finance dashboard. my db roles are called 'admin' and 'finance'.
This is my login form:
this is what I have so far:
<form method="post" name="login_form">
<div class="form-group">
<input class="form-control form-control-lg" id="username" alt="username" type="text" placeholder="Username" autocomplete="off">
</div>
<div class="form-group">
<input class="form-control form-control-lg" id="password" type="password" alt="password" placeholder="Password" autocomplete="off">
</div>
<div class="input-group mb-3">
<select type="text" class="form-control" name="type" required="">
<option value="" disabled="" disabled="" selected="true">--Select Role--</option>
<option value="admin">Admin</option>
<option value="finance">Finance</option>
</select>
</div>
<div class="form-group">
<label class="custom-control custom-checkbox">
<input class="custom-control-input" type="checkbox" id="remember" onclick="myFunction()"><span class="custom-control-label">Show Password</span>
</label>
</div>
<div class="form-group">
<button class="btn btn-lg btn-block button3" ;color: rgb(243, 245, 238) !important;" value="Sign in" id="btn-login" name="btn-login">Log in</button>
</div>
<div class="form-group" id="alert-msg">
</form>
am I missing something?
<script type="text/javascript">
jQuery(function(){
$('form[name="login_form"]').on('submit', function(e){
e.preventDefault();
var u_username = $(this).find('input[alt="username"]').val();
var p_password = $(this).find('input[alt="password"]').val();
// var s_status = 1;
if (u_username === '' && p_password ===''){
$('#alert-msg').html('<div class="alert alert-danger"> Required Username and Password!</div>');
}else{
$.ajax({
type: 'POST',
url: 'init/controllers/login_process.php',
data: {
username: u_username,
password: p_password
//status: s_status
},
beforeSend: function(){
$('#alert-msg').html('');
}
})
.done(function(t){
if (t == 0){
$('#alert-msg').html('<div class="alert alert-danger">Incorrect username or password!</div>');
}else{
$("#btn-login").html('<img src="assets/images/loading.gif" /> Signing In ...');
setTimeout(' window.location.href = "documents/index.php"; ',2000);
}
});
}
});
});
</script>
<script>
function myFunction() {
var x = document.getElementById("password");
if (x.type === "password") {
x.type = "text";
} else {
x.type = "password";
}
}
</script>

Related

AJAX fails to get data from input

I am trying to create/insert data into the database, but I am still getting an error for getting the data I've input. I tried using the dump and die method, and I encountered that no data is being gotten from the data that has been input. What could be wrong with my codes?
Here is the result of the inspected element
Click to see image
My Modal
<div id="modalAddChild" class="modal fade" tabindex="-1" aria-labelledby="modalAddChild">
#csrf_field
{{ method_field('PUT') }}
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title"><b>Add Child</b></h4>
<button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">X</button>
</div>
<div class="modal-body">
<p><i>Note: In Weight, it is required to put (.) regardless if it is (.0).</i></p>
<p><i>Note: In Height, do not add (.) if it is (.0) but it is allowed to put (.) if it's any number.</i>
</p>
<form id="saveChild" method="post">
<div class="form-group row">
<div class="col-sm-6">
<label for="mothersname">Mother's Name:</label>
<input type="text" class="form-control" id="mothersname" name="mothersname" required>
</div>
<div class="col-sm-6">
<label for="childsname">Child's Name:</label>
<input type="text" class="form-control" id="childsname" name="childsname" required>
</div>
</div>
<div class="form-group row">
<div class="col-sm-6">
<label>Indigenous:</label>
<select class="form-control" id="ind_id" name="ind_id" required>
<option value="">YES or NO</option>
#foreach ($indigenous as $key => $value)
<option id="{{ $key }}" value="{{ $key }}">{{ $value }}</option>
#endforeach
</select>
</div>
<div class="col-sm-6">
<label>Sex:</label>
<select class="form-control" id="sex_id" name="sex_id" required>
<option value="">M or F</option>
#foreach ($sex as $key => $value)
<option id="{{ $key }}" value="{{ $key }}">{{ $value }}</option>
#endforeach
</select>
</div>
</div>
<div class="form-group row">
<div class="col-sm-6">
<label>Date of Birth:</label>
<input type="text" class="form-control" id="birthdate" name="birthdate"
placeholder="YYYY-MM-DD" required>
</div>
<div class="col-sm-6">
<label>Actual Date of Weighing:</label>
<input type="text" class="form-control" id="actualdate" name="actualdate"
placeholder="YYYY-MM-DD" required>
</div>
</div>
<div class="form-group row">
<div class="col-sm-6">
<label>Weight(kg):</label>
<input type="text" class="form-control" id="weight" name="weight" required>
</div>
<div class="col-sm-6">
<label>Height(cm):</label>
<input type="text" class="form-control" id="height" name="height" required>
</div>
</div>
<div class="form-group row">
<div class="col-sm-6">
<label for="zone">Zone:</label>
<input type="text" class="form-control" id="zone" name="zone" required>
</div>
<div class="col-sm-6">
<label>Age in Months:</label>
<input type="text" class="form-control" id="ageinmonths" name="ageinmonths" required>
</div>
</div>
<div class="form-group">
<button type="submit" value="Submit" class="btn btn-flat btn-primary" id="saveBtn">Submit</button>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
My AJAX
<script type="text/javascript">
$('#saveChild').submit('click', function() {
var zone = $('#zone').val();
var mothersname = $('#mothersname').val();
var childsname = $('#childsname').val();
var ind_id = $('#ind_id').val();
var sex_id = $('#sex_id').val();
var birthdate = $('#birthdate').val();
var actualdate = $('#actualdate').val();
var weight = $('#weight').val();
var height = $('#height').val();
var ageinmonths = $('#ageinmonths').val();
var dataString="zone="+zone+"&mothersname="+mothersname+"&childsname="+childsname+"&ind_id="+ind_id+"&sex_id="+sex_id
+"&birthdate="+birthdate+"&actualdate="+actualdate+"&weight="+weight+"&height="+height+"&ageinmonths="+ageinmonths;
$.ajax({
type: "POST",
dataType: "JSON",
data: dataString,
url: "insert_child",
success: function(data) {
console.log(data);
if (data == "success"){
alert("Data successfully added!");
} else if (data = "failed") {
alert("ERROR IN FETCHING DATA!");
}
displayData();
}
});
return false;
});
$('#saveBtn').click(function() {
$('#modalAddChild').modal('hide');
});
$('#modalAddChild').on('hidden.bs.modal', function(e) {
$(this)
.find("input,textarea,select")
.val('')
.end()
.find("input[type=checkbox], input[type=radio]")
.prop("checked", "")
.end();
})
</script>
This old ajax is working before but I changed it to the ajax mentioned above but both of them are not working anymore.
My OLD Ajax
<script type="text/javascript">
$('#saveChild').submit('click', function() {
var zone = $('#zone').val();
var mothersname = $('#mothersname').val();
var childsname = $('#childsname').val();
var ind_id = $('#ind_id').val();
var sex_id = $('#sex_id').val();
var birthdate = $('#birthdate').val();
var actualdate = $('#actualdate').val();
var weight = $('#weight').val();
var height = $('#height').val();
var ageinmonths = $('#ageinmonths').val();
$.ajax({
type: "POST",
dataType: "JSON",
data: {
zone: zone,
mothersname: mothersname,
childsname: childsname,
ind_id: ind_id,
sex_id: sex_id,
birthdate: birthdate,
actualdate: actualdate,
weight: weight,
height: height,
ageinmonths: ageinmonths,
"_token": "{{ csrf_token() }}"
},
url: "insert_child",
success: function(data) {
alert("Data successfully added!");
displayData();
}
});
return false;
});
$('#saveBtn').click(function() {
$('#modalAddChild').modal('hide');
});
$('#modalAddChild').on('hidden.bs.modal', function(e) {
$(this)
.find("input,textarea,select")
.val('')
.end()
.find("input[type=checkbox], input[type=radio]")
.prop("checked", "")
.end();
})
</script>
well in your first line off java script you wrote:
$('#saveChild').submit('click', function()
this is wrong, the jquery submit event only gets a function, but you passed a 'click' event as well.
you should write it like this:
$('#saveChild').submit(function()...

Bootraps 4 Validation

Good Day,
I`ve been doing a registration form using bootstrap validation. But the problem is I did it correctly but the error style are still the same.
<script type="text/javascript">
$("#createaccount").click(function(event) {
// Fetch form to apply custom Bootstrap validation
var form = $("#registration")
if (form[0].checkValidity() === false) {
event.preventDefault()
event.stopPropagation()
}else{
$('#registration').on('submit', function(event){
event.preventDefault();
$.ajax({
url:"/validation'); ?>",
method:"POST",
data:$(this).serialize(),
dataType:"json",
beforeSend:function(){
$('#createaccount').attr('disabled', 'disabled');
},
success:function(data)
{
if(data.error)
{
//USERNAME
if(data.username_error != '')
{
$('#username_error').html(data.username_error);
$("#username").removeClass('is-valid');
$("#username").addClass('is-invalid');
}
else
{
$('#username_error').html('');
$("#username").removeClass('is-invalid');
$("#username").addClass('is-valid');
}
//EMAIL
if(data.email_error != '')
{
$('#email_error').html(data.email_error);
$("#email").removeClass('is-valid');
$("#email").addClass('is-invalid');
}
else
{
$('#email_error').html('');
$("#email").removeClass('is-invalid');
$("#email").addClass('is-valid');
}
//PASSWORD
if(data.password_error != '')
{
$('#password_error').html(data.password_error);
$("#password").removeClass('is-valid');
$("#password").addClass('is-invalid');
}
else
{
$('#password_error').html('');
$("#password").removeClass('is-invalid');
$("#password").addClass('is-valid');
}
//CONFIRMPASSWORD
if(data.confirmPassword_error != '')
{
$('#confirmPassword_error').html(data.confirmPassword_error);
$("#confirmPassword").removeClass('is-valid');
$("#confirmPassword").addClass('is-invalid');
}
else
{
$('#confirmPassword_error').html('');
$("#confirmPassword").removeClass('is-invalid');
$("#confirmPassword").addClass('is-valid');
}
//PIN
if(data.pin_error != '')
{
$('#pin_error').html(data.pin_error);
$("#pin").removeClass('is-valid');
$("#pin").addClass('is-invalid');
}
else
{
$('#pin_error').html('');
$("#pin").removeClass('is-invalid');
$("#pin").addClass('is-valid');
}
//CAPCHA
if(data.g_recaptcha_response != '')
{
$('#g_recaptcha_response').html(data.g_recaptcha_response);
}
else
{
$('#g_recaptcha_response').html('');
}
//TOS
if(data.invalidCheck_error != '')
{
$('#invalidCheck_error').html('You must agree before submitting.');
$("#invalidCheck").removeClass('is-valid');
$("#invalidCheck").addClass('is-invalid');
}
else
{
$('#invalidCheck_error').html('');
$("#invalidCheck").removeClass('is-invalid');
$("#invalidCheck").addClass('is-valid');
}
}
if(data.success)
{
$('#success_message').html(data.success);
$('#username_error').html('');
$("#username").removeClass('is-invalid');
$("#username").removeClass('is-valid');
$('#email_error').html('');
$("#email").removeClass('is-invalid');
$("#email").removeClass('is-valid');
$('#password_error').html('');
$("#password").removeClass('is-invalid');
$("#password").removeClass('is-valid');
$('#confirmPassword_error').html('');
$("#confirmPassword").removeClass('is-invalid');
$("#confirmPassword").removeClass('is-valid');
$('#pin_error').html('');
$("#pin").removeClass('is-invalid');
$("#pin").removeClass('is-valid');
$('#invalidCheck_error').html('');
$("#invalidCheck").removeClass('is-invalid');
$("#invalidCheck").removeClass('is-valid');
$('#registration')[0].reset();
}
$('#createaccount').attr('disabled', false);
}
})
});
}
form.addClass('was-validated');
});
</script>
<form class="needs-validation" method="post" id="registration">
<span id="success_message"></span>
<div class="form-group input-icon-left m-b-10">
<i class="fa fa-user"></i>
<input type="text" name="username" id="username" class="form-control form-control-secondary" placeholder="Username" minlength="4" maxlength="12" pattern="[a-zA-Z0-9._\s]+" required>
<div class="invalid-feedback" id="username_error"></div>
</div>
<div class="form-group input-icon-left m-b-10">
<i class="fa fa-envelope"></i>
<input type="email" name="email" id="email" class="form-control form-control-secondary" placeholder="Email Address" required>
<div class="invalid-feedback" id="email_error"></div>
</div>
<div class="divider"><span>Security</span></div>
<div class="form-group input-icon-left m-b-10">
<i class="fa fa-lock"></i>
<input type="password" name="password" id="password" class="form-control form-control-secondary" placeholder="Password" minlength="4" maxlength="12" pattern="[a-zA-Z0-9._\s]+" required>
<div class="invalid-feedback" id="password_error"></div>
</div>
<div class="form-group input-icon-left m-b-10">
<i class="fa fa-unlock"></i>
<input type="password" name="confirmPassword" id="confirmPassword" class="form-control form-control-secondary" placeholder="Repeat Password" required>
<div class="invalid-feedback" id="confirmPassword_error"></div>
</div>
<div class="form-group input-icon-left m-b-10">
<i class="fa fa-key"></i>
<input type="password" name="pin" id="pin" class="form-control form-control-secondary" placeholder="Pin" minlength="4" maxlength="12" pattern="[0-9._\s]+" required>
<div class="invalid-feedback" id="pin_error"></div>
</div>
<?php
if(get_settings('site_settings','enable_recapcha','')!=0){ ?>
<div class="divider"><span>I am not a robot</span></div>
<!-- recaptcha -->
<div class="d-flex justify-content-center">
<div class="form-group">
<div class="g-recaptcha-outer">
<!-- get yours: https://www.google.com/recaptcha/admin -->
<script src='https://www.google.com/recaptcha/api.js'></script>
<div class="g-recaptcha" data-sitekey="<?php echo get_settings('site_settings','recaptcha_secretkey',''); ?>"></div>
</div>
</div>
<div class="invalid-feedback" id="g_recaptcha_response"></div>
</div>
<?php } ?>
<div class="divider"><span>Terms of Service</span></div>
<div class="form-check">
<input class="form-check-input" type="checkbox" value="0" name="invalidCheck" id="invalidCheck" required>
<label class="form-check-label" for="invalidCheck">
<span class="custom-control-description">Accept to terms of use</span>
</label>
<div class="invalid-feedback" id="invalidCheck_error"></div>
</div>
<input type="submit" class="btn btn-primary m-t-10 btn-block" value="Create Account" name="createaccount" id="createaccount"/>
</form>
Please check the result below, as you can see I was able the display the error using ajax but the input text still on a success mode. Hope anyone can help me with this I`m not good with ajax and jQuery. If you hate this just ignore my post instead giving my a negative feedback. Thanks

how do I get correct output for this form validation code?

My code is executing only else statement ... I couldn't find a problem.
When I validated form attribute address with javascript, it is not taking validation from PHP code and taking else statement
expected result: Thanks for your order
actual result: technical issue
<?php
$toEmail = "herbsoul1#gmail.com";
$mailHeaders = "From: " . $_POST["name"] . "<". $_POST["email"] .">\r\n";
$subject="Site Mail from Xtreme-Fatburn";
$content="Name : ".$_POST["name"]."\n";
$content=$content."MobileNo : ".$_POST["MobileNo"]."\n";
$content=$content."Email : ".$_POST["email"]."\n";
$content=$content."State : ".$_POST["State"]."\n";
$content=$content."Address : ".$_POST["address"]."\n";
if(mail($toEmail, $subject, $content, $mailHeaders)) {
print "Thanks for your order.";
} else {
print "Some Technical Issues occured.";
}
?>
background code
<div id="about1" class="container-fluid " style="width:100%;height:580px">
<div class="row bg">
<div class="col-md-9"></div>
<div class="col-md-2" style="margin-top:192px;margin-left:0px;">
<div class="row main">
<div class="main-login main-center">
<form class="form-horizontal" method="post">
<div class="form-group">
<label for="name" class="cols-sm-2 control-label dntr">Your Name</label><span id="userName-info" class="info">*</span>
<div class="cols-sm-6">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-user fa" aria-hidden="true"></i></span>
<input type="text" class="form-control" name="name" id="name" maxlength="30" placeholder="Enter your Name" />
</div>
</div>
</div>
<div class="form-group">
<label for="username" class="cols-sm-2 control-label dntr">Mobile No</label><span id="userName-info" class="info">*</span>
<div class="cols-sm-6">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-mobile-phone" style="font-size:20px"></i></span>
<input type="text" class="form-control" name="MobileNo" id="MobileNo" onkeypress="return isNumber(event)" maxlength="10" placeholder="Enter your Mobile No" />
</div>
</div>
</div>
<div class="form-group">
<label for="email" class="cols-sm-2 control-label dntr">Your Email ID</label><span id="userName-info" class="info"></span>
<div class="cols-sm-6">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-envelope fa" aria-hidden="true"></i></span>
<input type="text" class="form-control" maxlength="30" name="email" id="email" placeholder="Enter your Email ID" />
</div>
</div>
</div>
<div class="form-group">
<label for="username" class="cols-sm-2 control-label dntr">State</label><span id="userName-info" class="info">*</span>
<div class="cols-sm-6">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-users fa" aria-hidden="true"></i></span>
<select class="form-control" id="sel1">
<option>Andaman and Nicobar Islands</option>
<option>Andhra Pradesh</option>
<option>Arunachal Prades</option>
<option>Assam</option>
<option>Bihar</option>
<option>Chhattisgarh</option>
<option>Chandigarh</option>
<option>Dadra and Nagar Haveli</option>
<option>Daman and Diu</option>
<option selected>Delhi</option>
<option>Goa</option>
<option>Gujarat</option>
<option>Haryana</option>
<option>Himachal Pradesh</option>
<option>Jammu and Kashmir</option>
<option>Jharkhand</option>
<option>Karnataka</option>
<option>Kerala</option>
<option>Lakshadweep</option>
<option>Madhya Pradesh</option>
<option>Maharashtra</option>
<option>Manipur</option>
<option>Meghalaya</option>
<option>Mizoram</option>
<option>Nagaland</option>
<option>Odisha</option>
<option>Punjab</option>
<option>Puducherry</option>
<option>Rajasthan</option>
<option>Sikkim</option>
<option>Tamil Nadu</option>
<option>Telangana</option>
<option>Tripura</option>
<option>Uttarakhand</option>
<option>Uttar Pradesh</option>
<option>West Bengal</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<label for="address" class="cols-sm-2 control-label dntr">Your Address</label><span id="userName-info" class="info">*</span>
<div class="cols-sm-6">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-user fa" aria-hidden="true"></i></span>
<input type="text" class="form-control" name="address" id="address" maxlength="30" placeholder="Enter your address" />
</div>
</div>
</div>
<div class="form-group" style="padding-top:10px;">
<button type="button" class="btn btn-primary btn-lg btn-block login-button" id="Register" onClick="sendContact();">RUSH MY ORDER</button>
</div>
</form>
</div>
</div>
</div>
<div class="col-md-1"></div>
</div>
</div>
javascript code
<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
<style>
.info {
font-size: .8em;
color: #FF6600;
letter-spacing: 1px;
padding-left: 5px;
}
</style>
<script>
function sendContact() {
var valid;
valid = validateContact();
if (valid) {
var name1 = $("#name").val();
var MobileNo1 = $("#MobileNo").val();
var email1 = $("#email").val();
var state1 = $("#sel1").val();
var address1 = $("#address").val();
jQuery.ajax({
url: "sendemail.php",
data: {
name: name1,
MobileNo: MobileNo1,
email: email1,
State: state1,
address: address1
},
type: "POST",
success: function(data) {
//$('#Register').html(data);
$("#name").val('');
$("#MobileNo").val('');
$("#email").val('');
$("#address").val('');
//$("#mail-status").html(data);
alert(data);
},
error: function() {}
});
}
}
function validateContact() {
var valid = true;
if (!$("#name").val()) {
valid = false;
alert("Please Enter Your Name");
return valid;
}
if ($("#email").val()) {
if (!$("#email").val().match(/^([\w-\.]+#([\w-]+\.)+[\w-]{2,4})?$/)) {
valid = false;
alert("Invalid Email ID");
return valid;
}
}
if (!$("#MobileNo").val()) {
valid = false;
alert("Please Enter Your Mobile Number");
return valid;
}
return valid;
}
$(document).ready(function() {
$('.openPopup').on('click', function() {
debugger;
$(".modal-content").html('');
var dataURL = $(this).attr('href');
//$('.modal-body').load(dataURL,function(){
// $('#dialog-example').modal({show:true});
//});
$.get(dataURL, function(data) {
//alert(data);
$(".modal-content").html(data).foundation("open");
});
});
});
function isNumber(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode != 46 && charCode > 31 &&
(charCode < 48 || charCode > 57))
return false;
return true;
}
</script>
For getting the post data, change the button type to submit:
type="submit"
Also check the post data before sending mail
If you are working locally in windows In C:\xampp\php in php.ini file you have to check the setup. Find mail function and do the changes as below
[mail function]
; XAMPP: Don’t remove the semi column if you want to work with an SMTP Server like Mercury
; SMTP = localhost
; smtp_port = 25
Remove the semi colons before SMTP and smtp_port and set the SMTP to your smtp server and the port to your smtp port. Your settings should look as follows
SMTP = smtp.example.com
smtp_port = 25
And if your configuration is fine, please check the mail spam folder or mail configuration, whether it has some restriction.
OR
Use PHPMailerAutoload.php PHPMailer, that is quiet easy.
I tried your "HTML, Javascript & PHP" codes in my Windows XAMPP and after configuring the details in the php.ini & in sendmail.ini files, as given in this link, I can successfully send the email.

my form is not posting values even though i have put method="post" in my form

my form is not posting values even though i have put method="post" and i think there is no error in my form.i have hide some input types by javascript. i am not understanding where the problem is can you rectify that ..my code is
<?php include "header.php" ?>
<!DOCTYPE html>
<html>
<head>
<style>
</style>
</head>
<body>
<div class="col-md-9" style="padding-top:10px;">
<h3 align="center">Blood Bank Registration </h3>
<form role="form" action="bbinsert.php" method="post" style="color:black">
<div class="form-group">
<input type="text" class="form-control" name="bbname" id="college" placeholder="Blood bank name" required>
</div>
<div class="form-group">
<select class="form-control" id="district" name="district" required>
<option >Select District</option>
<option value="prakasam">Prakasam</option>
<option value="guntur">Guntur</option>
<option value="Nellore">Nellore</option>
</select>
</div>
<div class="form-group">
<select class="form-control" id="mandal" name="mandal" required>
<option >Select Mandal</option>
</select>
</div>
<div class="form-group">
<select class="form-control" id="village" name="village" required>
<option >Select Village</option>
</select>
</div>
<div class="form-group" >
<input type="text" class="form-control" name="phno" placeholder="contact number" >
</div>
<p align="right">create employee<button onclick="return show();"><span class="glyphicon glyphicon-plus" ></span></button></p>
<div id="empform" style="display:none;" >
<div class="form-group">
<input type="text" class="form-control" name="empname1" placeholder="Employee Name" >
</div>
<div class="form-group">
<input type="text" class="form-control" name="empid1" placeholder="Employee Id" >
</div>
<div class="form-group">
<input type="text"class="form-control" name="password1" placeholder="password" >
</div>
<div class="form-group">
<input type="text"class="form-control" name="phno1" placeholder="Contact Number">
</div>
<p align="right"><button onclick="return hide();"><span class="glyphicon glyphicon-minus" ></span></button><button onclick="return show1();"><span class="glyphicon glyphicon-plus" ></span></button></p>
</div>
<div id="empform2" style="display:none;" >
<div class="form-group">
<input type="text" class="form-control" name="empname3" placeholder="Employee Name" >
</div>
<div class="form-group">
<input type="text" class="form-control" name="empid3" placeholder="Employee Id" >
</div>
<div class="form-group">
<input type="text"class="form-control" name="password3" placeholder="password" >
</div>
<div class="form-group">
<input type="text"class="form-control" name="phno3" placeholder="Contact Number">
</div>
<p align="right"><button onclick="return hide2();"><span class="glyphicon glyphicon-minus" ></span></button></p><br>
</div>
<input type="submit" class="btn btn-success" value="create" >
</form>
<script>
function show() {
if(document.getElementById('empform').style.display=='none') {
document.getElementById('empform').style.display='block';
}
return false;
}
function hide() {
if(document.getElementById('empform').style.display=='block') {
document.getElementById('empform').style.display='none';
}
return false;
}
function show1() {
if(document.getElementById('empform1').style.display=='none') {
document.getElementById('empform1').style.display='block';
}
return false;
}
function hide1() {
if(document.getElementById('empform1').style.display=='block') {
document.getElementById('empform1').style.display='none';
}
return false;
}
function show2() {
if(document.getElementById('empform2').style.display=='none') {
document.getElementById('empform2').style.display='block';
}
return false;
}
function hide2() {
if(document.getElementById('empform2').style.display=='block') {
document.getElementById('empform2').style.display='none';
}
return false;
}
</script>
bbinsert.php
<?php
include "connection.php";
if (isset($_POST['submit']))
{
$bbname=$_POST['bbname'];
$district=$_POST['district'];
$mandal=$_POST['mandal'];
$village=$_POST['village'];
$phno=$_POST['phno'];
$insertbb=mysqli_query($conn,"INSERT INTO bloodbanks(bbname,bbdistrict,bbmandal,bbcity,phno)VALUES('$bbname','$district',$mandal','$village','$phno')");
if(!$insertbb)
echo "error in blood bank insertion".mysqli_error($conn);
else
echo "successfully inserted blood banks";
$emp1 = array('empname1', 'empid1', 'password1','phno1');
$emp2 = array('empname2', 'empid2', 'password2','phno2');
$emp3 = array('empname3', 'empid3', 'password3','phno3');
$error = false; //No errors yet
foreach($emp1 AS $fieldname)
{ //Loop trough each field
if(!isset($_POST[$fieldname]) || empty($_POST[$fieldname]))
{
$error = true; //Yup there are errors
}
}
if(!$error) {
$empn1=$_POST['empname1'];
$empid1=$_POST['empid1'];
$password1=$_POST['password1'];
$phno1=$_POST['phno1'];
$insert1=mysqli_query($conn,"INSERT INTO employees(name,empid,password,phno,bbname)VALUES('$empn1','$emmpid1','$password1 ','$phno1','$bbname')");
if(!$insert1)
echo "error in emp1".mysqli_error($conn);
else
echo "success emp1";
}
$error1 = false; //No errors yet
foreach($emp2 AS $fieldname)
{ //Loop trough each field
if(!isset($_POST[$fieldname]) || empty($_POST[$fieldname]))
{
$error1 = true; //Yup there are errors
}
}
if(!$error1) {
$empn2=$_POST['empname2'];
$empid2=$_POST['empid2'];
$password2=$_POST['password2'];
$phno2=$_POST['phno2'];
$insert2=mysqli_query($conn,"INSERT INTO employees(name,empid,password,phno,bbname)VALUES('$empn2','$emmpid2','$password2','$phno2','$bbname')");
if(!$insert2)
echo "error in emp2".mysqli_error($conn);
else
echo "success emp2";
}
$error3 = false; //No errors yet
foreach($emp3 AS $fieldname)
{ //Loop trough each field
if(!isset($_POST[$fieldname]) || empty($_POST[$fieldname]))
{
$error3 = true; //Yup there are errors
}
}
if(!$error3) {
$empn3=$_POST['empname3'];
$empid3=$_POST['empid3'];
$password3=$_POST['password1'];
$phno3=$_POST['phno3'];
$insert3=mysqli_query($conn,"INSERT INTO employees(name,empid,password,phno,bbname)VALUES('$empn3','$emmpid3','$password3','$phno3','$bbname')");
if(!$insert3)
echo "error in emp3".mysqli_error($conn);
else
echo "success emp3";
}
}
else
{
echo "submit method did not post the form";
}
?>
`
Your submit button doesn't have a name attribute. So no post element called "submit" exists. Put a name on your submit button if you want it to post.

working ajax - posting variable into another page that execute

I have the following script that executes after a form has been clicked
<script type="text/javascript">
// This identifies your website in the createToken call below
Stripe.setPublishableKey('CODE');
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;
// Insert the token into the form so it gets submitted to the server
$form.append($('<input type="text" name="stripeToken" />').val(token));
// and re-submit
}
};
jQuery(function($) {
$('#payment-form').submit(function(e) {
var $form = $(this);
// Disable the submit button to prevent repeated clicks
$form.find('button').prop('disabled', true);
Stripe.card.createToken($form, stripeResponseHandler);
// Prevent the form from submitting with the default action
return false;
});
});
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>
My problem is that the php paymentEmail.php does not run after the script is done.
My objective is as follow:
once and only this line has been run
$form.append($('<input type="text" name="stripeToken" />').val(token));
The followings happen:
The value of stripeToken gets posted to paymentEmail.php
paymentEmail.php gets executed.
If you're curious, below is how the paymentEmail.php looks like:
<?php
if(isset($_POST['paid'])){
$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);
}
Thanks in advance
Update:
<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>
Update 2:
<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
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($('<input type="text" name="stripeToken" />').val(token));
php code
<?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);
$location = "../paymentConfirmed.php";
header( "Location: $location" );
?>
Try this:
// This identifies your website in the createToken call below
Stripe.setPublishableKey('');
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 = $('#[put the form id here]'); // TODO: give your html-form-tag an "id" attribute and type this id in this line. IMPORTANT: Don't replace the '#'!
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")
// Disable the submit button to prevent repeated clicks
$('#[put the input id here]').prop('disabled', true); // TODO: give your html-submit-input-tag an "id" attribute
alert(response);
}
});
}
There are two TODO comments!
EDIT: Modified code
The request is asynchronous!
Create a function that executes your script and calls the phpCall() at the end.
Make your html formular call the new method.
-> The request should be started when the script was done.
EDIT: The new function could look like this:
// You don't need jQuery
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);
phpCall();
}
Call method on the submitButton and change his type from submit to button:
<input type="button" onClick="onSubmit()" value="Submit" name="submit" />
(You can remove the action and method attribute from the form tag)
<form id="my-form">
<!-- stuff -->
<!-- put the input tag here -->
</form>
You have defined the function phpCall() but you are not calling it anywhere within your script. Simply call the function or remove function declaration so that function internals run procedurally.

Categories