I was trying to create a signup form where a user has to give his data along with the image. I have attached the snippet of the code I was trying but couldn't achieve please help me. I have already been through other similar question but none of them helped me.
function submitForm1()
{
var data = $("#signup").serialize();
$.ajax({
type : 'POST',
url : 'signup_process.php',
data : data,
async: false,
beforeSend: function()
{
$("#error1").fadeOut();
$("#btn-signup").html('<span class="glyphicon glyphicon-transfer"></span> Signing Up..Please wait.');
},
success : function(response)
{
if(response=="ok"){
$("#error1").fadeIn(1000, function(){
$("#error1").html('<div class="alert alert-success"> <span class="glyphicon glyphicon-info-sign"></span> An Email has been sent to your entered email address. Please follow the instruction to activate your account.</div>');
$("#btn-signup").html('<span class="glyphicon glyphicon-transfer"></span> Sign Up');
});
}
else{
$("#error1").fadeIn(1000, function(){
$("#error1").html('<div class="alert alert-danger"> <span class="glyphicon glyphicon-info-sign"></span> '+response+' !</div>');
$("#btn-signup").html('<span class="glyphicon glyphicon-log-in"></span> Sign In');
});
}
}
cache: false,
contentType: false, //must, tell jQuery not to process the data
processData: false,
});
return false;
}
/* login submit */
});
<div class="container">
<div class="signup-form-container">
<form id="signup" name="form1">
<div class="head"></div>
<div class="form-header" style="text-align:center;">
<div class="image" id="preview">
<div id="timelineShade" style="background:url(assets/pic.png) center;"></div>
</div>
<h3 class="form-title" style="margin-top:-60px;"><span style="margin-right:50px;"></span>Recruiter Sign-up Portal</h3>
</div>
<div class="form-body">
<!-- json response will be here -->
<div id="error1"></div>
<!-- json response will be here -->
<div class="form-group">
<div class="input-group">
<div class="input-group-addon"><span class="glyphicon glyphicon-user"></span></div>
<input type="text" name="name" class="form-control" placeholder="Full Name" id="name" /> </div>
<span class="help-block" id="error"></span>
</div>
<div class="form-group">
<div class="input-group">
<div class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></div>
<input type="text" name="email" class="form-control" placeholder="Email" id="email" /> </div>
<span class="help-block" id="error"></span>
</div>
<div class="row">
<div class="form-group col-lg-6">
<div class="input-group">
<div class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></div>
<input type="password" name="password" id="password" class="form-control"placeholder="Password" /> </div>
<span class="help-block" id="error"></span>
</div>
<div class="form-group col-lg-6">
<div class="input-group">
<div class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></div>
<input type="password" name="cpassword" class="form-control" placeholder="Confirm Password"/> </div>
<span class="help-block" id="error"></span>
</div>
</div>
<div class="form-group col-lg-6" style="max-width:145px; margin-top:10px;">
<div class="input-group">
<label>Company Logo</label>
</div>
</div>
<div class="form-group">
<div class="input-group">
<input id="imagein" name="image" type="file" class="form-control" limit=1/>
</div>
<span class="help-block" id="error"></span>
</div>
</div>
<div class="form-footer">
<button type="submit" name="btn-signup" id="btn-signup" class="btn bt-login" style="margin-left:8%; width:92%" >Sign-up <span class="glyphicon glyphicon-log-in"></span> </button>
</div>
<div class="form-footer"> <div class="col-xs-4 col-sm-4 col-md-4" style="margin-left:0%; float:left;">
<i class="fa fa-lock"></i>
Forgot password? </div>
<div class="col-xs-4 col-sm-4 col-md-4" style="margin-left:0%; float:right;">
<i class="fa fa-user"></i>
Log-In </div>
</div>
</form>
</div>
</div>
<?php
session_start();
$upload_dir = '/upload/'; // upload directory
error_reporting(0);
require_once 'class.user.php';
$reg_user = new USER();
if($reg_user->is_logged_in()!="")
{$reg_user->redirect('home.php');}if(isset($_POST['btn-signup'])){
$phone = trim($_POST['phone']);$email = trim($_POST['email']);
$upass = trim($_POST['password']);$code = md5(uniqid(rand()));
$imgExt = strtolower(pathinfo($imgFile,PATHINFO_EXTENSION));
$valid_extensions = array('jpeg', 'jpg', 'png', 'gif');
$userpic = rand(1000,1000000).".".$imgExt;
if(in_array($imgExt, $valid_extensions)){if($imgSize < 5000000){
move_uploaded_file($tmp_dir,$upload_dir.$userpic);}else{
$errMSG = "Sorry, your file is too large.";}}else{
$errMSG = "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";}
if($reg_user->register($phone,$email,$upass,$code,$userpic)){
$id = $reg_user->lasdID();$key = base64_encode($id);$id = $key;
$message = "Hello $email,<br /><br />
Welcome to Coding Cage!To complete your registration please , just
clickfollowing link<br/><br /><br /><a href='http://localhost/x/verify.php?
id=$id&code=$code'>Click HERE to Activate :)</a><br /><br />Thanks,";
$subject = "Confirm Registration";require_once('mailer/class.phpmailer.php');
$mail = new PHPMailer();$mail->IsSMTP(); $mail->SMTPDebug = 0;
$mail->SMTPAuth = true; $mail->SMTPSecure = "ssl";
$mail->Host= "smtp.gmail.com"; $mail->Port= 465;
$mail->AddAddress($email);
$mail->Username="sharma.himanshu0405#gmail.com";
$mail->Password="mypassword";
$mail->SetFrom('sharma.himanshu0405#gmail.com','Himanshu');
$mail->Subject = $subject;
$mail->Subject = $subject; $mail->MsgHTML($message);
if($mail->send()) { echo "ok" ; } else {
echo "Sorry, Registration is not possible this time. Please try again after some time or Contact Admin";
$stmt = $reg_user->runQuery("DELETE FROM tbl_users WHERE user_email=:email_id");
$stmt->execute(array(":email_id"=>$email));
}
}
}
?>
Have to encode the image in the form to base64 (not sure) before providing serialized form data in ajax call
Related
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.
I have done a file upload for code inside a form and on submit the form should insert into database which is not happening and I am fetching the table in another page and when I click on particular file it is not redirecting to page properly.
jobs.php
<div id="apply" class="overlay">
<div class="popup">
<a class="close" href="jobs.php">×</a>
<div class="content" style="margin-top: 20px;">
<form enctype="multipart/form-data" class="" action="upload.php" id="template-jobform" name="template-jobform" method="post" role="form" value="<?php echo htmlspecialchars($row['id']);?>">
<div class="cols-sm-10">
<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="template-jobform-fname" id="name" placeholder="Enter your Name"/>
</div>
</div>
</div>
<div class="form-group">
<div class="cols-sm-10">
<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" name="template-jobform-email" id="email" placeholder="Enter your Email"/>
</div>
</div>
</div>
<div class="form-group">
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-phone fa" aria-hidden="true"></i></span>
<input type="phone" class="form-control" name="template-jobform-phone" id="mobile" placeholder="Mobile Number"/>
</div>
</div>
</div>
<div class="form-group">
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-briefcase fa" aria-hidden="true"></i></span>
<input type="text" class="form-control" name="job_name" id="mobile" placeholder="Position Applying For"/>
</div>
</div>
</div>
<div class="form-group">
<div class="cols-sm-10">
<div class="input-group">
<input type="file"
class="filepond"
name="file"
multiple/>
<!-- <button type="submit" name="btn-upload">upload</button> -->
</div>
</div>
</div>
<?php
include('admin/config.php');
ini_set("display_errors", 1);
if(isset($_POST['btn-upload']) && $_POST['template-jobform-email']!= '' && $_POST['template-jobform-fname']!= '') {
$sql = "INSERT INTO apply_job (`template-jobform-fname`,`template-jobform-email`,`template-jobform-phone`,`job_name`) VALUES (?,?,?,?)";
$stmt = mysqli_prepare($db,$sql);
$stmt->bind_param("ssss", $_POST['template-jobform-fname'], $_POST['template-jobform-email'], $_POST['template-jobform-phone'],$_POST['job_name']);
$stmt->execute();
}
?>
<div class="form-group">
<button target="_blank" type="submit" name="btn-upload" class="btn btn-primary btn-lg btn-block">Apply</button>
</div>
</form>
<br /><br />
<?php
if(isset($_GET['success']))
{
?>
<label>File Uploaded Successfully... click here to view file.</label>
<?php
}
else if(isset($_GET['fail']))
{
?>
<label>Problem While File Uploading !</label>
<?php
}
else
{
?>
<label>Try to upload any files(PDF, DOC, EXE, VIDEO, MP3, ZIP,etc...)</label>
<?php
}
?>
</div>
</div>
</div>
upload.php
if(isset($_POST['btn-upload']))
{
$file = rand(1000,100000)."-".$_FILES['file']['name'];
$file_loc = $_FILES['file']['tmp_name'];
$file_size = $_FILES['file']['size'];
$file_type = $_FILES['file']['type'];
$folder="admin/uploads/";
// new file size in KB
$new_size = $file_size/1024;
// new file size in KB
// make file name in lower case
$new_file_name = strtolower($file);
// make file name in lower case
$final_file=str_replace(' ','-',$new_file_name);
if(move_uploaded_file($file_loc,$folder.$final_file))
{
$sql="INSERT INTO apply_job(file,type,size) VALUES('$final_file','$file_type','$new_size')";
mysqli_query($db,$sql);
echo $sql;
?>
<script>
alert('successfully uploaded');
window.location.href='jobs.php?success';
</script>
<?php
}
?>
Image
As shown in above image when I click on pdf how can i set correct pdf path for the file so that it redirects properly.
On first look, your opening form-tag is not following the HTML-Markup language restrictions. Please note, that HTML (like XML) requires a tree structure for tags, to not get unexpected behaviour.
Example:
Allowed: <form><div></div></form>
Not allowed: <div><form></div></form>
Maybe that could fix the redirection error.
I have a contact form that I'm using phpmailer to send out the information that was entered in the form and once sent is redirected to another page. Which works great, now what I would like is to have all the information that is sent to the email address also posted on the redirect page (ie - target.php). I use 3 pages 1 for html, 1 for verify(js) and 1 (phpmailer) to send. I have read other questions here and I know if you put the redirect page in the action"target.php" on the form you can get the data, except I have to put action"appt.php" which is my phpmailer form. I have tried:
<body>
<div class="container">
<div class="row">
<h2>Form data</h2>
<hr/>
<p>This is a simple page showing the data you have just submitted</p>
<?php
$fullnameField = $_POST['fullname'];
echo $fullnameField;
$addressField = $_POST['address'];
echo $addressField;
?>
</div>
</div>
</body>
I put the code above on the target.php page.
This is what I get when redirected to target.php page:
Notice: Undefined index: fullname in C:\xampp\htdocs\appt\target.php on line 14
Notice: Undefined index: address in C:\xampp\htdocs\appt\target.php on line 16
Also tried taking off Field at the end of the $ and still get the same code.
Here is html page:
<form id="defaultForm" method="post" class="form-horizontal" action="appt.php">
<fieldset>
<!-- Form Name -->
<legend>Appointment Request</legend>
<!-- Full Name -->
<div class="form-group">
<label class="col-md-4 control-label">Full Name*</label>
<div class="col-md-6 inputGroupContainer">
<div class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input name="fullname" placeholder="Your Full Name" class="form-control" type="text">
</div>
</div>
</div>
<!-- Address -->
<div class="form-group">
<label class="col-md-4 control-label" >Address*</label>
<div class="col-md-6 inputGroupContainer">
<div class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-road"></i></span>
<input name="address" placeholder="Your Address" class="form-control" type="text">
</div>
</div>
</div>
<!-- City -->
<div class="form-group">
<label class="col-md-4 control-label">City*</label>
<div class="col-md-6 inputGroupContainer">
<div class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-home"></i></span>
<input name="city" placeholder="Your City" class="form-control" type="text">
</div>
</div>
</div>
<!-- State Select -->
<div class="form-group">
<label class="col-md-4 control-label">State*</label>
<div class="col-md-6 selectContainer">
<div class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
<select name="state" class="form-control selectpicker" >
<option value=" " >Please select your state</option>
<option>Ohio</option>
<option>Pennsylvania</option>
</select>
</div>
</div>
</div>
<!-- Zip Code -->
<div class="form-group">
<label class="col-md-4 control-label">Zip Code*</label>
<div class="col-md-6 inputGroupContainer">
<div class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-globe"></i></span>
<input name="zip" placeholder="Your Zip Code" class="form-control" type="text">
</div>
</div>
</div>
<!-- Phone Number -->
<div class="form-group">
<label class="col-md-4 control-label">Phone*</label>
<div class="col-md-6 inputGroupContainer">
<div class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-earphone"></i></span>
<input name="phone" placeholder="(330)123-1234" class="form-control" type="text">
</div>
</div>
</div>
<!-- Email -->
<div class="form-group">
<label class="col-md-4 control-label">E-mail*</label>
<div class="col-md-6 inputGroupContainer">
<div class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span>
<input name="email" placeholder="Your Email Address" class="form-control" type="text">
</div>
</div>
</div>
<!-- Appt Reason Select -->
<div class="form-group">
<label class="col-md-4 control-label">Appt Reason*</label>
<div class="col-md-6 selectContainer">
<div class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
<select name="reason" class="form-control selectpicker" >
<option value=" ">Select Your Appointment Reason</option>
<option>Roofing</option>
<option>Siding</option>
<option>Doors</option>
<option>Windows</option>
<option>Decking</option>
<option>Comfort Rooms</option>
<option>Kitchen</option>
</select>
</div>
</div>
</div>
<!-- Appt Date -->
<div class="form-group">
<label class="col-md-4 control-label">Appt Date*</label>
<div class="col-md-6 inputGroupContainer">
<div class="input-group date" id="datepicker"> <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
<input name="apptDate" placeholder="Date You Would Like Appt" class="form-control" type="text">
</div>
</div>
</div>
<!-- Appt Time-->
<div class="form-group">
<label class="col-md-4 control-label">Appt Time*</label>
<div class="col-md-6 inputGroupContainer">
<div class="input-group date" id="timepicker"> <span class="input-group-addon"><i class="glyphicon glyphicon-time"></i></span>
<input name="apptTime" placeholder="Time You Would Like Appt" class="form-control" type="text">
</div>
</div>
</div>
<!-- Contact Method Select -->
<div class="form-group">
<label class="col-md-4 control-label">Contact You*</label>
<div class="col-md-6 selectContainer">
<div class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
<select name="method" class="form-control selectpicker" >
<option value=" ">Select Your Contact Method</option>
<option>Email</option>
<option>Phone</option>
</select>
</div>
</div>
</div>
<!-- Project Description -->
<div class="form-group">
<label class="col-md-4 control-label">Project Description*</label>
<div class="col-md-6 inputGroupContainer">
<div class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-pencil"></i></span>
<textarea class="form-control" name="comment" placeholder="Project Description" rows="5"></textarea>
</div>
</div>
</div>
<!-- Captcha -->
<div class="form-group">
<label class="col-md-4 control-label">Captcha</label>
<div class="col-md-6 inputGroupContainer">
<div id="captchaContainer"></div>
</div>
</div>
<!-- Button -->
<div class="form-group">
<label class="col-md-4 control-label"></label>
<div class="col-md-4">
<button type="submit" class="btn btn-primary" >Send <span class="glyphicon glyphicon-send"></span></button>
</div>
</div>
</fieldset>
</form>
appt.php (phpmailer form):
<?php
session_start();
/**
* This example shows settings to use when sending via Google's Gmail servers.
*/
//SMTP needs accurate times, and the PHP time zone MUST be set
//This should be done in your php.ini, but this is how to do it if you don't have access to that
date_default_timezone_set('Etc/UTC');
//Contact Form Data
$fullnameField = $_POST['fullname'];
$addressField = $_POST['address'];
$cityField = $_POST['city'];
$stateField = $_POST['state'];
$zipcodeField = $_POST['zip'];
$phoneField = $_POST['phone'];
$emailField = $_POST['email'];
$apptReasonField = $_POST['reason'];
$apptDateField = $_POST['apptDate'];
$apptTimeField = $_POST['apptTime'];
$methodField = $_POST['method'];
$commentsField = $_POST['comment'];
require 'mailer/PHPMailerAutoload.php';
//Create a new PHPMailer instance
$mail = new PHPMailer();
//Tell PHPMailer to use SMTP
$mail->isSMTP();
//Enable SMTP debugging
// 0 = off (for production use)
// 1 = client messages
// 2 = client and server messages
$mail->SMTPDebug = 0;
//Ask for HTML-friendly debug output
$mail->Debugoutput = 'html';
//Set the hostname of the mail server
$mail->Host = 'smtp.aol.com';
// use
// $mail->Host = gethostbyname('smtp.gmail.com');
// if your network does not support SMTP over IPv6
//Set the SMTP port number - 587 for authenticated TLS, a.k.a. RFC4409 SMTP submission
$mail->Port = 587;
//Set the encryption system to use - ssl (deprecated) or tls
$mail->SMTPSecure = 'tls';
//Whether to use SMTP authentication
$mail->SMTPAuth = true;
//Username to use for SMTP authentication - use full email address for gmail
$mail->Username = "username";
//Password to use for SMTP authentication
$mail->Password = "password";
//Set who the message is to be sent from
$mail->setFrom('sent from');
//Set who the message is to be sent to
$mail->addAddress('sent to');
//Set the subject line
$mail->Subject = 'Information For Appointment Wanted';
//Read an HTML message body from an external file, convert referenced images to embedded,
//convert HTML into a basic plain-text alternative body
$mail->Body = <<<EOD
<br><p>Here is the information $fullnameField entered in your Appointment form.</p>
<br><hr><br>
<b>Name:</b> $fullnameField<hr><br>
<b>Address:</b> $addressField<hr><br>
<b>City:</b> $cityField<hr><br>
<b>State:</b> $stateField<hr><br>
<b>Zip Code:</b> $zipcodeField<hr><br>
<b>Phone #:</b> $phoneField<hr><br>
<b>E-mail:</b> $emailField<hr><br>
<b>Appointment Reason:</b> $apptReasonField<hr><br>
<b>Date Wanted For Appointment:</b> $apptDateField<hr><br>
<b>Time Wanted For Appointment:</b> $apptTimeField<hr><br>
<b>Best Way To Contact You:</b> $methodField<hr><br>
<b>Project Description:</b> $commentsField<hr><br>
EOD;
//Replace the plain text body with one created manually
$mail->AltBody = 'This is a plain-text message body';
//send the message, check for errors
if(!$mail->Send())
{
echo "Mailer Error: " . $mail->ErrorInfo;
}else{
$_SESSION[fullname]=$fullnameField;
$_SESSION[address]=$addressField;
$_SESSION[city]=$cityField;
$_SESSION[state]=$stateField;
$_SESSION[zip]=$zipcodeField;
$_SESSION[phone]=$phoneField;
$_SESSION[email]=$emailField;
$_SESSION[reason]=$apptReasonField;
$_SESSION[apptDate]=$apptDateField;
$_SESSION[apptTime]=$apptTimeField;
$_SESSION[method]=$methodField;
$_SESSION[comment]=$commentsField;
header('Location: http://localhost/appt/target.php');
}
Here is the target.php
<?php session_start(); ?>
<!DOCTYPE html>
<html>
<head>
<title>Thank You</title>
<link rel="stylesheet" href="css/bootstrap.css"/>
</head>
<body>
<div class="container">
<div class="row">
<p class="thank">Thank you <b><?php echo $_SESSION['fullname']; ?></b> for scheduling an appointment with U.S. Pride Home Specialists. We will be contacting you by the contact method you chose as soon as possible.</p>
</div>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8">Your Appointment Form Information</div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>Name:</b> <?php echo $_SESSION['fullname']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>Address:</b> <?php echo $_SESSION['address']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>City:</b> <?php echo $_SESSION['city']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>State:</b> <?php echo $_SESSION['state']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>Zip Code:</b> <?php echo $_SESSION['zip']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>Phone:</b> <?php echo $_SESSION['phone']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>E-mail:</b> <?php echo $_SESSION['email']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>Appointment Reason:</b> <?php echo $_SESSION['reason']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>Appointment Date Wanted:</b> <?php echo $_SESSION['apptDate']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>Appointment Time Wanted:</b> <?php echo $_SESSION['apptTime']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>Way You Wanted Contacted:</b> <?php echo $_SESSION['method']; ?></div><div class="col-md-2"></div>
</div>
<hr>
<div class="row">
<div class="col-md-2"></div><div class="col-md-8"><b>Project Description:</b> <?php echo $_SESSION['comment']; ?></div><div class="col-md-2"></div>
</div>
</div>
<?php
// remove all session variables
session_unset();
// destroy the session
session_destroy();
?>
</body>
</html>
You need to store your form data in a database table or session for persistence.
something like:
$mail->AltBody = 'This is a plain-text message body';
//send the message, check for errors
if(!$mail->Send())
{
echo "Mailer Error: " . $mail->ErrorInfo;
}else{
// BUILD $form_data here
$_SESSION['temp_form_data'] = serialize($form_data);
and after redirect just get data from session.
header('Location: http://localhost/appt/target.php');
}
And in the page that you show after redirect
in target.php
$form_data = unserialize($_SESSION['temp_form_data']);
// Use form data here
Another option would be to store it in database and retrieve it after redirect.
I do not suggest placing form data params and values over a url.
I am creating an app and I need a SignIn / SignUp functionality for the same. Here is my SignIn HTML:
<div style="padding-top:30px" class="panel-body" >
<div style="display:none" id="login-alert" class="alert alert-danger col-sm-12"></div>
<form action="verifySignin" method="post" id="verifySignin" class="form-horizontal" role="form">
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input id="login-username" type="text" class="form-control" name="username" value="" placeholder="username" required="" autofocus="" >
</div>
<div style="margin-bottom: 25px" class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
<input id="login-password" type="password" class="form-control" name="password" placeholder="password">
</div>
<div style="margin-top:10px" class="form-group">
<!-- Button -->
<div class="col-sm-12 controls">
<button class="btn btn-md btn-primary btn-block" type="submit">Login</button>
</div>
</div>
<div class="form-group">
<div class="col-md-12 control">
<div style="border-top: 1px solid#888; padding-top:15px; font-size:85%" > Don't have an account?
<a href="#" onClick="$('#loginbox').hide(); $('#signupbox').show()">
Sign Up Here
</a>
</div>
</div>
</div>
</form>
</div>
My app.js has the following to route:
app.post('/verifySignin', home.verifySignin);
app.get('/verifySignin', home.verifySignin);
Under routes folder> I have created a home.js file which contains the following:
function verifySignin(req,res)
{
req.session.name=req.param("username");
var password = req.param("password");
console.log("session name:"+req.session.name);
var verifyUserQuery="select username, password from Users where Username='"+req.param("username")+"' and Password = '"+req.param("password")+"'";
mysql.fetchData(function(err,results){
if(err){
throw err;
}
else
{
if(results.username==req.param("username") && results.password == password){
res.render('kanban', { name: req.param("username") });}
else {
res.render('ErrorPage');
}
}
},verifyUserQuery);
}
exports.verifySignin=verifySignin;
When I click on the Login button, I get the error : Cannot POST /verifySignin.
Any help would really be appreciated. Thanks.
Try to use it like,
var users = require('./home/users');
in addition, this is a very bad practice due to security concerns
"select username, password from Users where Username='"+req.param("username")+"' and Password = '"+req.param("password")+"'"
pass values as parameters or bind them.
My AJAX call gets triggered for one condition, however when it proceeds to new nested php function it showing the output is the php processing file...Below is my Code.. i am using bootstrap 3.0 framework on this one and pure javascript.
<!-- Modal Register -->
<div id="register" class="modal fade">
<div class="modal-dialog">
<div class="container">
<div class="col-xs-12 col-sm-10 col-md-8 col-md-offset-1" style="max-width:400px;">
<form role="form" method="POST" id="reg" action="reg-check.php">
<div class="panel panel-primary" style="border:1px solid black;">
<div class="panel-heading" style="background-color:black;">
<h3 class="panel-title">
Register
<button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="color:white;">×</button>
</h3>
</div>
<div class="panel-body ">
<div class="login-box">
<img src="images/newlogo2.png" width="100%;"><br/><br/>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-user"></span>
</span>
<input type="text" class="form-control" name="name" placeholder="Name" autofocus />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-earphone"></span>
</span>
<input type="tel" class="form-control" name="mobile" placeholder="Mobile Number" required />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-briefcase"></span>
</span>
<input type="email" class="form-control" name="email" placeholder="email" required/>
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-hand-right"></span>
</span>
<input type="password" id="pass" class="form-control" name="password" placeholder="Password" required />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-hand-right"></span>
</span>
<input type="password" id = "pass1"class="form-control" name="password1" placeholder="Confirm Password" required />
</div>
<label>
<input type="checkbox" name="agree" value="agree"> I agree to the terms and conditions of the website and cookie policy</label>
</div>
<div class="panel-footer">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12" style="text-align:center;">
<p><span id="errorMessage"></span></p>
<button id="submitreg" type="submit" class="btn btn-labeled btn-success" data-dismiss="none" onClick="javascript:ajax_post();">
<span class="btn-label">
<i class="glyphicon glyphicon-ok"></i>
</span>Submit</button>
<button type="reset" class="btn btn-labeled btn-danger" >
<span class="btn-label">
<i class="glyphicon glyphicon-remove"></i>
</span>lReset</button>
</div>
</div>
</div>
</div>
</div>
</form>
<div><p id="errorMessage"></p></div>
</div>
</div>
</div>
<!-- /.modal-dialog -->
</div>
My Ajax Scripts`
function ajax_post(){
// Create our XMLHttpRequest object
var hr = new XMLHttpRequest();
// Create some variables we need to send to our PHP file
var url = "reg-check.php?";
hr.open("POST", url, true);
// Access the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
console.log(return_data);
document.getElementById("errorMessage").innerHTML = return_data;
}
}
// Send the data to PHP now... and wait for response to update the status div
hr.send(); // Actually execute the request
document.getElementById("errorMessage").innerHTML = "processing...";
}
MY PHP Script
<?php
require ("/Pages/dbc.php");
if(!empty($_POST['name']) && !empty($_POST['mobile']) && !empty($_POST['email']) && !empty($_POST['password']) && !empty($_POST['password1']))
{
$name =mysql_real_escape_string($_POST['name']);
$mobile =mysql_real_escape_string($_POST['mobile']);
$email =mysql_real_escape_string($_POST['email']);
$password =mysql_real_escape_string($_POST['password']);
$password1 =mysql_real_escape_string($_POST['password1']);
$query =mysql_query("SELECT * FROM `register` WHERE `mobile`= $mobile");
$numrows =mysql_num_rows($query);
if($numrows == 0){
$query1 =mysql_query("SELECT * FROM `register` WHERE `email`= '$email'");
$numrows1 =mysql_num_rows($query1);
if($numrows1==0){
if($password == $password1){
mysql_query("INSERT INTO `cabs4rent`.`register` (`name`, `mobile`, `email`, `password`) VALUES ('$name', '$mobile', '$email', '$password');");
echo "Registration Successful";
}else{
echo "Passwords do not match";
}
}else{
echo "Emails is already registered";
}
}else{
echo "Mobile Number Already Registered";
}
}
else
{
echo 'Please fill all the details';
}
exit;
?>
I will changing to mysqli/pdo very soon.
The problem was with the action attr in my form element. hence i removed the form element and and in ajax made changes and used urlencoder to send the data... everything work smoothly..
Here is the code
function ajax_post(){
// Create our XMLHttpRequest object
//preventDefault();
var hr = new XMLHttpRequest();
var name =document.getElementById("name").value;
var mobile =document.getElementById("mobile").value;
var email =document.getElementById("email").value;
var password =document.getElementById("pass").value;
var password1 =document.getElementById("pass1").value;
var vars = "name="+name+"&mobile="+mobile+"&email="+email+"&password="+password+"&password1="+password1;
// Create some variables we need to send to our PHP file
var url = "reg-check.php?";
hr.open("POST", url, true);
hr.setRequestHeader("Content-type","application/x-www-form-urlencoded")
// Access the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
console.log(return_data);
document.getElementById("errorMessage").innerHTML = return_data;
}
}
// Send the data to PHP now... and wait for response to update the status div
hr.send(vars); // Actually execute the request
document.getElementById("errorMessage").innerHTML = "processing...";
}
Form without the formelement
<!-- Modal Register -->
<div id="register" class="modal fade">
<div class="modal-dialog">
<div class="container">
<div class="col-xs-12 col-sm-10 col-md-8 col-md-offset-1" style="max-width:400px;">
<div class="panel panel-primary" style="border:1px solid black;">
<div class="panel-heading" style="background-color:black;">
<h3 class="panel-title">
Register
<button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="color:white;">×</button>
</h3>
</div>
<div class="panel-body ">
<div class="login-box">
<img src="images/newlogo2.png" width="100%;"><br/><br/>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-user"></span>
</span>
<input type="text" class="form-control"id="name" name="name" placeholder="Name" autofocus />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-earphone"></span>
</span>
<input type="tel" class="form-control" id="mobile" name="mobile" placeholder="Mobile Number" required />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-briefcase"></span>
</span>
<input type="email" class="form-control" id="email" name="email" placeholder="email" required/>
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-hand-right"></span>
</span>
<input type="password" id="pass" class="form-control" name="password" placeholder="Password" required />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-hand-right"></span>
</span>
<input type="password" id = "pass1"class="form-control" name="password1" placeholder="Confirm Password" required />
</div>
</div>
<div class="panel-footer">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12" style="text-align:center;">
<p><span id="errorMessage"></span></p>
<button id="submitreg" type="submit" class="btn btn-labeled btn-success" data-dismiss="none" onClick="javascript:ajax_post();">
<span class="btn-label">
<i class="glyphicon glyphicon-ok"></i>
</span>Submit</button>
<button type="button" id="regReset" onclick="rested();" class="btn btn-labeled btn-danger" >
<span class="btn-label">
<i class="glyphicon glyphicon-remove"></i>
</span>Reset</button>
</div>
<p><span id="errorMessage"></span></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /.modal-dialog -->
</div>
No changes made to to PHP script.
It looks like you're not posting any data.
// Create some variables we need to send to our PHP file
var url = "reg-check.php?";
doesn't add any of the values to the url.
You schould do something like
var name_value=document.getElementById('name').value;
var mobile_value=document.getElementById('mobile').value;
var url = "reg-check.php?" + "name=" + name_value + "&mobile=" + mobile_val;