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.
Related
Hi I want to create animation notification system with toastr and PHP MySQL, But I don't understand how can I do that. I already Integrate jQuery Toastr Plugin in my header and footer files I want to create like below picture
This is example Image
I'm new so I can't understand how I can do that. Please help me.
Below are my html and PHP code. Please tell me How I can call success message, warning message and error message.
<?php include_once('inc/header.php');
$database = new Database();
$db = $database->getConnection();
$addmouja = new Mutation($db);
?>
<!-- start page title -->
<div class="row">
<div class="col-12">
<div class="page-title-box">
<h4 class="page-title">নতুন মৌজা</h4>
<div class="page-title-right">
<ol class="breadcrumb m-0">
<li class="breadcrumb-item">ড্যাশবোর্ড</li>
<li class="breadcrumb-item active">নতুন মৌজা</li>
</ol>
</div>
</div>
</div>
</div>
<!-- end page title -->
<div class="row">
<div class="col-12">
<div class="card font-18">
<div class="card-body">
<?php
if(isset($_POST['add_mouja'])){
$mouja_n = $_POST['mname'];
$mouja_jal = $_POST['mjal'];
if($addmouja->addMouja($mouja_n, $mouja_jal)){
echo '<script type="text/javascript">toastr.success("Have Fun")</script>';
}else{
echo "<div id='toastr-four'></div>";
}
}
?>
<form method="post">
<div class="row">
<div class="col-md-6">
<label for="moujaName" class="col-form-label">মৌজার নাম <span style="color: red">*</span></label>
<input type="text" class="form-control" name="mname" autocomplete="off" required>
</div>
<div class="col-md-6">
<label for="moujaJal" class="col-form-label">জে, এল নং <span style="color: red">*</span></label>
<input type="text" class="form-control" name="mjal" autocomplete="off" required>
</div>
</div>
<p class="text-center">
<button type="submit" name="add_mouja" class="btn btn-success mt-2">Add Mouja</button>
<button type="reset" class="btn btn-danger mt-2">Reset</button>
</p>
</form>
</div>
</div>
</div>
</div>
<?php include_once('inc/footer.php');?> ```
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'm trying to build a contact form as I play around with building a website, but I'm not sure I'm doing it right. I'm using a bootstrap template and have the contact form at the bottom of the page. I have a model representing my class and have a controller that, from what I've gathered online, should be handling the clicking of the button, but something is clearly wrong. My background is C++ and Java, so this is a different ballgame, so can anyone tell me what I need to do to get it working? Code below. Thank you!
HomeController.cs:
namespace WebPlay.Controllers
{
public class HomeController : Controller
{
[HttpGet]
public ActionResult Index()
{
return View();
}
[HttpPost]
public ActionResult Index(ContactInfo ci)
{
try
{
MailMessage mail = new MailMessage();
mail.To.Add(ci.Email);
mail.From = new MailAddress("email#gmail.com");
mail.Subject = "New Request";
string userMessage = "";
userMessage = "<br/>Name :" + ci.FirstName + " " + ci.LastName;
userMessage = userMessage + "<br/>Phone No: " + ci.ContactInfoID;
userMessage = userMessage + "<br/>Message: " + ci.Comments;
mail.Body = userMessage;
mail.IsBodyHtml = true;
SmtpClient smtp = new SmtpClient();
//SMTP Server Address of gmail
smtp.Host = "smtp.gmail.com";
smtp.Port = 587;
smtp.Credentials = new System.Net.NetworkCredential("xxxxxxx", "xxxxxxx");
// Smtp Email ID and Password For authentication
smtp.EnableSsl = true;
smtp.Send(mail);
ViewBag.Message = "Thank you for contacting us.";
}
catch
{
ViewBag.Message = "Fail";
}
return View();
}
}
Index.cshtml:
#{
ViewBag.Title = "Home Page";
}
<!-- Navigation -->
<nav class="navbar navbar-custom navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand page-scroll" href="#page-top">
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-right navbar-main-collapse">
<nav class="navbar navbar-dark bg-inverse">
<a class="page-scroll" href="#about">About</a>
<a class="page-scroll" href="#download">Download</a>
<a class="page-scroll" href="#contact">Contact</a>
</nav>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<!-- Intro Header -->
<header class="intro">
<div class="intro-body">
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h1 class="brand-heading">Greetings...</h1>
<p class="intro-text">I'm Jon. This is my site.<br>Ya know what's up.</p>
<i class="fa fa-angle-double-down animated"></i>
</a>
</div>
</div>
</div>
</div>
</header>
<!-- About Section -->
<section id="about" class="container content-section text-center">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<h2>About Me</h2>
<p>I'm a programmer, crossfitter, and taco lover. The last 2 don't go togther so well.</p>
</div>
</div>
</section>
<!-- Download Section -->
<section id="download" class="content-section text-center">
<div class="download-section">
<div class="container">
<div class="col-lg-8 col-lg-offset-2">
<h2>Download Grayscale</h2>
<p>You can download Grayscale for free on the preview page at Start Bootstrap.</p>
Visit Download Page
</div>
</div>
</div>
</section>
<!-- Contact Section -->
<section id="contact" class="container content-section text-center">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<h2>3...2...1...Contact Me</h2>
<p>Feel free to contact me for a quote or to just say hello!</p>
<form class="form-horizontal" role="form" method="post" action="index.php">
<div class="form-group">
<label for="name" class="col-sm-2 control-label">First Name:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="name" name="name" value="">
</div>
</div>
<div class="form-group">
<label for="name" class="col-sm-2 control-label">Last Name:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="name" name="name" value="">
</div>
</div>
<div class="form-group">
<label for="phone" class="col-sm-2 control-label">Phone:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="email" name="email" value="">
</div>
</div>
<div class="form-group">
<label for="email" class="col-sm-2 control-label">Email:</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="email" name="email" value="">
</div>
</div>
<div class="form-group">
<label for="exampleSelect1">Reason for contacting me:</label>
<select class="form-control" id="exampleSelect1">
<option>Quote on work</option>
<option>Just for fun</option>
<option>I might have a job for you</option>
</select>
</div>
<div class="radio">
<label><input type="radio" name="optradio">I need a web app</label>
</div>
<div class="radio">
<label><input type="radio" name="optradio">I need a Windows app</label>
</div>
<div class="radio">
<label><input type="radio" name="optradio">I need a phone app</label>
</div>
<div class="radio">
<label><input type="radio" name="optradio">I need nothing</label>
</div>
<div class="form-group">
<label for="message" class="col-sm-2 control-label">Message:</label>
<div class="col-sm-10">
<textarea class="form-control" rows="4" name="message"></textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<input id="submit" name="submit" type="submit" value="Send" class="btn btn-primary">
</div>
<button class="btn btn-danger" type="reset">Reset</button>
</div>
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<! Will be used to display an alert to the user>
</div>
</div>
</form>
</div>
</div>
</section>
<!-- Map Section -->
<div id="map"></div>
<!-- Footer -->
<footer>
<div class="container text-center">
<p>Copyright © Your Website 2014</p>
</div>
</footer>
ContactInfo class:
namespace PellegriniP3_1.Models
{
public class ContactInfo
{
public string Comments { get; set; }
public int ContactInfoID { get; set; }
public string Email { get; set; }
public string FirstName { get; set; }
public string LastName { get; set; }
public bool IsPhoneApp { get; set; }
public bool IsWebApp { get; set; }
public bool IsWindowsApp { get; set; }
public string TypeOfRequest { get; set; }
}
}
<form class="form-horizontal" role="form" method="post" action="index.php">
<div class="form-group">
<label for="name" class="col-sm-2 control-label">Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="name" name="name" placeholder="First & Last Name" value="<?php echo htmlspecialchars($_POST['name']); ?>">
<?php echo "<p class='text-danger'>$errName</p>";?>
</div>
</div>
<div class="form-group">
<label for="email" class="col-sm-2 control-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="email" name="email" placeholder="example#domain.com" value="<?php echo htmlspecialchars($_POST['email']); ?>">
<?php echo "<p class='text-danger'>$errEmail</p>";?>
</div>
</div>
<div class="form-group">
<label for="message" class="col-sm-2 control-label">Message</label>
<div class="col-sm-10">
<textarea class="form-control" rows="4" name="message"><?php echo htmlspecialchars($_POST['message']);?></textarea>
<?php echo "<p class='text-danger'>$errMessage</p>";?>
</div>
</div>
<div class="form-group">
<label for="human" class="col-sm-2 control-label">2 + 3 = ?</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="human" name="human" placeholder="Your Answer">
<?php echo "<p class='text-danger'>$errHuman</p>";?>
</div>
</div>
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<input id="submit" name="submit" type="submit" value="Send" class="btn btn-primary">
</div>
</div>
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<?php echo $result; ?>
</div>
</div>
</form>
Please check this link:-https://bootstrapbay.com/blog/working-bootstrap-contact-form/
Please check demo from following url, its working :
1.https://bootstrapious.com/p/how-to-build-a-working-bootstrap-contact-form
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
I am trying to send users to different pages/URL's based on the option they choose in the checkbox. I tried everything but can't seem to figure out the correct "if statement" to do it. Not sure what the easiest way to accomplish this is. PLEASE HELP!
Here is my HTML code for the form:
<!-- Register start -->
<section id="register">
<div class="container">
<div class="row">
<div class="col-md-12">
<h2>Register Now</h2>
</div>
</div>
<div class="row registration-success-msg">
<div class="col-md-12">
<div class="alert alert-success"><strong>Congratulations!</strong> Your registration was successful.</div>
</div>
</div>
<div class="row validation-error-msg">
<div class="col-md-12">
<div class="alert alert-danger">Please check your data! All fields are required.</div>
</div>
</div>
<!-- Checkboxes Start Here -->
<div class="row">
<div class="col-md-6 plans">
<h3>1. Select your Plan</h3>
<div class="plan">
<div class="checkbox">
<i class="fa fa-square-o" name="Option1"></i>
</div>
<div class="offer">
<h4>1 DAY TICKET <span class="label">$ 29.00</span></h4>
<p>Here is some dummy text. You can also use tooltips. on top, but you can have it on the bottom too! </p>
</div>
</div>
<div class="plan">
<div class="checkbox">
<i class="fa fa-square-o" name="Option2"></i>
</div>
<div class="offer">
<h4>2 DAYS TICKET <span class="label">$ 39.00</span></h4>
<p>Here is some dummy text. You can also use tooltips. on top, but you can have it on the bottom too! </p>
</div>
</div>
<div class="plan">
<div class="checkbox">
<i class="fa fa-square-o" name="Option3"></i>
</div>
<div class="offer">
<h4>3 DAYS TICKET <span class="label">$ 49.00</span></h4>
<p>Here is some dummy text. You can also use tooltips. on top, but you can have it on the bottom too! </p>
</div>
</div>
</div>
<!-- Checkboxes END Here -->
<div class="col-md-6 register-form">
<h3>2. Enter your Personal information</h3>
<form action="submit-forms.php" method="post">
<input type="hidden" name="plan">
<input type="hidden" name="type" value="registration">
<div class="row">
<div class="col-md-12">
<input type="text" name="first_name" class="form-control" placeholder="First Name">
</div>
</div>
<div class="row">
<div class="col-md-12">
<input type="text" name="last_name" class="form-control" placeholder="Last Name">
</div>
</div>
<div class="row">
<div class="col-md-12">
<input type="text" name="email" class="form-control" placeholder="Email">
</div>
</div>
<div class="row">
<div class="col-md-12">
<input type="text" name="address" class="form-control" placeholder="Address">
</div>
</div>
<div class="row">
<div class="col-md-12">
<input type="text" name="zip_code" class="form-control" placeholder="Zip Code">
</div>
</div>
<div class="row">
<div class="col-md-12">
<input type="text" name="city" class="form-control" placeholder="City">
</div>
</div>
<div class="row">
<div class="col-md-12">
<button class="btn btn-block btn-default" data-loading-text="Loading..." data-complete-text="Registration Successful!" id="submit-registration">Submit Registration</button>
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<!-- Register end -->
Here is the ajax form that process the form and sends to the php file:
var formData = $("#register form").serialize();
// Send the Form
$.ajax({
//this is the php file that processes the data and send mail
url: "submit-forms.php",
//POST method is used
type: "POST",
//pass the data
data: formData,
//Do not cache the page
cache: false,
//success
success: function(data) {
//$("#submit-registration").button('complete');
//$('.registration-success-msg').fadeIn("slow");
console.log("success");
window.location.href = 'http://link1goeshere.com';
}
});
Here is the PHP FILE:
if('registration' == $submitType)
{
// prepare message
$body = "You have got a new registration from your website : \n\n";
$body .= "First Name: $_POST[first_name] \n\n";
$body .= "Last Name: $_POST[last_name] \n\n";
$body .= "Email: $_POST[email] \n\n";
$body .= "Address: $_POST[address] \n\n";
$body .= "Zip Code: $_POST[zip_code] \n\n";
$body .= "City: $_POST[city] \n\n";
$body .= "Plan: $_POST[plan] \n\n";
if( $_POST['email'] && !preg_match( "/[\r\n]/", $_POST['email']) ) {
$headers = "From: $_POST[email]";
} else {
$headers = "From: $youremail";
}
mail($youremail, 'New Registration', $body, $headers );
}
First of all your jQuery selector isn't going to match anything.
var formData = $("#register form").serialize();
You will need to use:
var formData = $("#register").find(form).serialize();
since the form element isn't a direct chidl of your #register element.
Edit: Sorry that is completely wrong, the two are identical.
Next, serialize() will give you a string 'name=value&name2=value2' etc whereas post data should be in the form of {name: value, name2: value2}.
Try serializeArray():
var formData = $("#register").find(form).serializeArray();
var postData = {};
formData.forEach(function (form) {
postData[form.name] = form.value;
});
$.post('submit-forms.php', postData, function (data) {
console.log(data);
window.href.location = 'http://link1goeshere.com';
});
However I still see no checkboxes...