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...
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 a contact form on a website, and I am trying to submit the form using Google recaptcha v2, (select the boxes which have a certain image in them). At the moment, the form successfully sends and is received exactly as I want it to; however, I want to create a 'success' alert using Bootstrap, but for some reason this is not working.
If you take a look at the last part of my PHP file I have the following code snippet:
if($responseKeys["success"]) {
mail($to,$email_subject,$email_body,$headers);
} else {
echo '<h2>This has been unsuccessful according to our security checks</h2>';
}
And the 'mail' command seems to work. But anything else I try to put in there, for example
echo '<h2>success!</h2>'
for example, it doesn't get rendered. Ideally, upon a success submit I would like the following to take place:
The form to refresh to blank
A success alert using Bootstrap show at the top of the page
But I am having trouble implementing these.
Here is the entire PHP file:
<?php
$Fname = $_POST['Fname'];
$Lname = $_POST['Lname'];
$email = $_POST['email'];
$number = $_POST['number'];
$company = $_POST['company'];
$message = $_POST['message'];
$email_from = "Your website";
$email_subject = "You have a new submission form from Your Website";
$email_body = "First Name: $Fname.\n".
"Last Name: $Lname.\n".
"Email Address: $email.\n".
"Telephone Number: $number.\n".
"Company Name: $company.\n".
"Message: $message.\n";
$to = "hello#yourwebsite.co.uk";
$headers = "From: $email_from \r\n";
$headers .= "Reply-To: $email \r\n";
$captcha;
if(isset($_POST['email'])){
$email=$_POST['email'];
}
if(isset($_POST['message'])){
$message=$_POST['message'];
}
if(isset($_POST['g-recaptcha-response'])){
$captcha=$_POST['g-recaptcha-response'];
}
if(!$captcha){
echo '<h2>Please check the "I am not a robot" checkbox"</h2>';
exit;
}
$secretKey = 'somesecretlettersandnumbers';
$ip = $_SERVER['REMOTE_ADDR'];
// post request to the server
$url = 'https://www.google.com/recaptcha/api/siteverify?secret=' . urlencode($secretKey) . '&response=' . urlencode($captcha);
$response = file_get_contents($url);
$responseKeys = json_decode($response, true);
// should return JSON with success as true
if($responseKeys["success"]) {
mail($to,$email_subject,$email_body,$headers);
} else {
echo '<h2>This has been unsuccessful according to our security checks</h2>';
}
?>
And here is the HTML form:
<form action="contact.php" id="contact-form" method="POST" role="form">
<div class="row">
<div class="col">
<div class="form-group">
<label for="form_name">First Name*</label>
<input id="form_name" type="text" class="form-control" name="Fname" placeholder="David" required data-error='Please fill in your first name'>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col">
<div class="form-group">
<label for="form_lastname">Last name*</label>
<input id="form_lastname" type="text" class="form-control" name="Lname" placeholder="Beckham" required data-error="Please fill in your last name">
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="form-group">
<label for="form_email">Email address*</label>
<input id="form_email" type="email" class="form-control" name="email" placeholder="becks#example.com" required data-error="Please provide your email address">
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col">
<div class="form-group">
<label for="form_number">Contact number*</label>
<input id="form_number" type="number" class="form-control" name="number" placeholder="01234567890" required data-error="Please provide a contact number">
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="form-group">
<label for="form_company">Your company name</label>
<input id="form_company" type="text" class="form-control" name="company" placeholder="Ex-footballers r us">
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="form-group">
<label for="form_message">Your message*</label>
<textarea id="form_message" class="form-control" name="message" cols="30" rows="10" placeholder="Here's my message" required></textarea>
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="g-recaptcha" data-sitekey="datasitekeynumbersandletters"></div>
</div>
</div>
<div class="row">
<div class="col">
<input type="submit" class="btn btn-outline-brand btn-block" name="submit" value="Send enquiry">
</div>
</div>
</form>
I have tried following this tutorial:
Bootstrap success alert upon form submition via javascript
Edited to add the only JS I have for this file:
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
without success.
Thank you in advance
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.
new to node js and mail gun. I am trying to send a 'contact us' email from a website that is using the following for my send button (on my index.html page).
<!-- START CONTACT SECTION -->
<section class="section-contact" id="contacts">
<div class="container">
<!-- START SECTION HEADER -->
<h2 class="reveal reveal-top">Contact Us</h2>
<div class="subheading reveal reveal-top">
Hit us up. Let us know how we can make things better ( <b>Support#mail.com </b>).
</div>
<!-- END SECTION HEADER -->
<div class="contact-form-wrapper reveal reveal-bottom">
<!-- START CONTACT FORM -->
<!-- <form method="POST" action="./scripts/writeus.php" accept-charset="UTF-8" class="contact-form" id="jvalidate" novalidate="novalidate"> -->
<form method="POST" action="./scripts/mailgun.php" accept-charset="UTF-8" class="contact-form" id="jvalidate" novalidate="novalidate">
<!-- <form method="POST" action="send_mailgun($email)" accept-charset="UTF-8" class="contact-form" id="jvalidate" novalidate="novalidate"> -->
<div class="row">
<div class="col-sm-12 col-md-4">
<div class="field-holder">
<input class="form-control input-lg field" placeholder="John Snow" name="name" type="text">
</div>
</div>
<div class="col-sm-12 col-md-4">
<div class="field-holder">
<input class="form-control input-lg field" placeholder="myReplyEmail#Address.com" name="email" type="email">
</div>
</div>
<div class="col-sm-12 col-md-4">
<div class="field-holder">
<input class="form-control input-lg field" placeholder="Subject" name="website" type="text">
</div>
</div>
<div class="col-md-12 col-xs-12">
<div class="field-holder">
<textarea class="form-control" placeholder="Some text" name="message" cols="50" rows="10"></textarea>
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<div class="alert alert-success" role="alert" style="display: none;">
Message has been successfully sent.
</div>
<div class="alert alert-danger" role="alert" style="display: none;">
<div class="alert-text">Server error</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<button class="btn btn-primary btn-contact" type="submit" value="SEND MESSAGE">SEND MESSAGE</button>
</div>
</div>
</form>
<!-- END CONTACT FORM -->
</div>
</div>
</section>
<!-- END CONTACT SECTION -->
I have Node.js with Express and mailgun installed and working on my local machine with the snippet bellow hard coded as a test in my server.js
var Mailgun = require('mailgun').Mailgun;
var mg = new Mailgun('some-api-key');
mg.sendText('example#example.com', 'Recipient 1 <rec1#example.com>',
'This is the subject',
'This is the text',
'noreply#example.com', {},
function(err) {
if (err) console.log('Oh noes: ' + err);
else console.log('Success');
});
How do I get the button info and send from my index.html ?
Thanks for the help. Much appreciated.
You need create web server to receive submit from your form or ajax call. Look this: http://expressjs.com/
example:
var express = require('express');
var Mailgun = require('mailgun').Mailgun;
var app = express();
app.post('/sendMail', function (req, res) {
/*use body-parser (https://github.com/expressjs/body-parser) for parameters */
var mg = new Mailgun('some-api-key');
mg.sendText('example#example.com', 'Recipient 1 <rec1#example.com>',
'This is the subject',
'This is the text',
'noreply#example.com', {},
function(err) {
if (err) {
console.log('Oh noes: ' + err);
res.send('Error occurred');
}
res.send('Email sent');
});
app.listen(3000, function () {
console.log('Example app listening on port 3000!');
});
I have a show and hide div. That is an add form. I want to display all data from the table on the bottom of the form. If form is opened or not, the data must be displayed. When we add new post, that must append on the top of displayed data without refresh.
My view
<div class="slidingDiv" style="display:none">
<div class="row">
<div class="col-xs-12">
<div class="box box-primary">
<div class="box-header">
<h3 class="box-title">Add Requirement Item</h3>
</div><!-- /.box-header -->
<!-- form start -->
<?php echo validation_errors(); ?>
<?php
$attributes = array('id' => 'myForm');
echo form_open_multipart(base_url().'moderator/Requirement/add_employee_data',$attributes); ?>
<div class="box-body">
<div class="row">
<div class="col-xs-6">
<div class="form-group">
<div class="row">
<div class="col-xs-12">
<label for="txttitle">Requirement Title (Product/Service) : </label>
</div>
<div class="col-xs-12">
<input type="text" name="txtService" class="form-control" id="txttitle" placeholder="Requirement Title (Product/Service) : " value="" required>
</div>
</div>
</div>
</diV>
<div class="col-xs-6">
<div class="form-group">
<div class="row">
<div class="col-xs-8">
<label for="txtquantity">Estimated Quantity : </label>
</div>
<div class="col-xs-4">
<label for="txtquantity"></label>
</div>
<div class="col-xs-8">
<input type="text" name="txtQuantity" class="form-control" id="txtquantity" placeholder="Estimated Quantity" value="
" required>
</div>
<div class="col-xs-4">
<select class="form-control" name="txtunit" required="required">
<option value="">----Select------</option>
<?php
foreach ($units as $name) {
echo ' <option value="' . $name->id . '">' . $name->name . '</option>';
}
?>
</select>
</div>
</div>
</div>
</diV>
<div class="col-xs-12">
<div class="form-group">
<div class="row">
<div class="col-xs-12">
<label for="txtdetails">Requirement Details : </label>
</div>
<div class="col-xs-12">
<textarea class="textarea" name="txtRequirement" placeholder="Requirement Details" id="txtdetails" style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;">
</textarea>
</div>
</div>
</div>
</div>
<div class="col-xs-12">
<div class="form-group">
<div class="row">
<div class="col-xs-6">
<label for="sbUser">Expiry of Requirement : </label><br>
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-calendar"></i>
</div>
<input id="thedate" type="text" name="txtBidclosing" class="form-control" required="required"/>
</div>
</div>
</div>
</div>
</div>
</div>
</div><!-- /.box-body -->
<div class="box-footer">
<input type="button" class="button" value="submit" />
</form>
</div>
</div>
</div>
</div>
<div id="sort">
<br>
</div>
Ajax code
<script>
$(document).ready(function(){
$(".button").click(function(){
$.ajax({
type:"POST",
url: "<?php echo base_url() ?>moderator/Requirement/add_employee_data",
data:$("#myForm").serialize(),
success: function (dataCheck) {
//alert(dataCheck);
$('#sort').append(dataCheck);
//window.location.reload();},
});});});
</script>
Model
public function add_employee_data($data){
$this->db->insert('jil_requirementdetail',$data);
$id = $this->db->insert_id();
$this->db->select('*');
$this->db->from('jil_requirementdetail');
$this->db->where('rqmd_id',$id);
$result = $this->db->get()->result();
return $result;
}
On your model
public function add_employee_data($data){
$this->db->insert('jil_requirementdetail',$data);
$id = $this->db->insert_id();
$this->db->select('*');
$this->db->from('jil_requirementdetail');
// $this->db->where('rqmd_id',$id); // get all data
$this->db->order_by('rqmd_id','DESC');
$result = $this->db->get();
if($result->num_row() > 0)
{
echo json_encode(['status'=>'pass','data'=>$result->result()];
}else{
echo json_encode(['status'=>'fail']);
}
}
On Ajax Success
<script>
$(document).ready(function(){
$(".button").click(function(){
$.ajax({
type: "POST",
url: "<?php echo base_url() ?>moderator/Requirement/add_employee_data",
data: $("#myForm").serialize(),
success: function(dataCheck){
//alert(dataCheck);
var res = JSON.parse(dataCheck);
if(res.status=='pass')
{
var user_data = res.data;
var html = '';
var length = user_data.length;
for(var i = 0; i < length; i++)
{
//your html
html += '<div>' + user_data[i].name + '</div>'; //add your html structure as you want
}
$('#sort').append(html);
},
}
});
});
});
</script>