I'm working on a website that will submit 2 forms, a hidden one that will send the data to a database and the visible one that will mail the form contents to a user. I looked up how to send multiple forms via javascript, and when I sent it the form that sent data to the database would work but the form that sent the data in an email wouldn't, the email would just be empty. I have hMailServer setup for local testing currently.
**index.php forms
<form id="form1" name="form1" method="POST" action="sendData.php">
<div class="col-sm-6">
<div class="form-controls left-sec">
<input id="name" name="name" type="text" placeholder="Your Name" pattern="[a-zA-Z0-9\s]+" required>
<input id="email" name="email" type="text" placeholder="Your Email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$" required>
<input id="subject" name="subject" type="text" placeholder="Subject" required>
</div>
</div>
<div class="col-sm-6">
<div class="form-controls right-sec">
<textarea id="message" name="message" placeholder="Type Message" required></textarea>
</div>
</div>
<div class="col-sm-12">
<div class="form-controls">
<input id="submitButton" type="button" name="submit1" class="btn" value="Send Message">
</div>
</div>
</form>
<form id="form2" name="form2" style="display:none;" type="hidden" method="POST" action="sendData.php">
<input style="display:none;" type="hidden" id="dbname" name="dbname">
<input style="display:none;" type="hidden" id="dbemail" name="dbemail">
<input style="display:none;" type="hidden" id="dbsubject" name="dbsubject">
<input style="display:none;" type="hidden" id="dbmessage" name="dbmessage">
</form>
<script>
"use strict";
var btn = document.getElementById("submitButton");
btn.onclick = submitForms; // calls function in forms.js, forms.js is included in index.php
</script>
// forms.js
"use strict";
function submitForms(){
var name = document.getElementById("name").value;
var email = document.getElementById("email").value;
var subject = document.getElementById("subject").value;
var message = document.getElementById("message").value;
var dbname = document.getElementById("dbname");
var dbemail = document.getElementById("dbemail");
var dbsubject = document.getElementById("dbsubject");
var dbmessage = document.getElementById("dbmessage");
debugger;
dbname.value = name;
dbemail.value = email;
dbsubject.value = subject;
dbmessage.value = message;
var f1 = document.getElementById("form1");
var f2 = document.getElementById("form2");
f1.submit();
f2.submit();
}
// forms.js debugging, lines cut out for convenience, f1 and f1 elements dont seem to be registering correctly as inputs
"use strict";
function submitForms(){
var name = document.getElementById("name").value; name = "testname"
var dbname = document.getElementById("dbname"); dbname = input#dbname {accept: "", alt: "", autocomplete: "", autofocus: false, defaultChecked: false, …}
var f1 = document.getElementById("form1"); f1 = form#form1
var f2 = document.getElementById("form2"); f2 = form#form2 {0: input#dbname, 1: input#dbemail, 2: input#dbsubject, 3: input#dbmessage, acceptCharset: "", action: "http://localhost/test/sendData.php", autocomplete: "on", enctype: "application/x-www-form-urlencoded", encoding: "application/x-www-form-urlencoded", …}
f1.submit();
f2.submit();
}
// sendData.php
<?php
session_start();
include("../Include/storeData.php");
include("../Include/sendMail.php");
if(isset($_POST["name"])){ // if I use just isset($_POST), database info sends but mail is empty, I put in $_POST["name"] to test my theory that it wasn't setting correctly
echo "<h1 style='font-weight: bolder; color: green; text-align: center;'>Message has been sent. Thank you!</h1>";
echo "<script>setTimeout(\"location.href = 'index.php';\",1500);</script>";
$_SESSION = [];
}
?>
// storeData.php
<?php
$host = "localhost";
$username = "root";
$password = "";
$link = mysqli_connect($host, $username, $password);
if(!$link){
die("Could not connect: " . mysqli_error());
}
function checkExists($l){
$db_selected = mysqli_select_db($l, "luberlaw");
if(!$db_selected){
$sql = "CREATE DATABASE db";
if(mysqli_query($l, $sql)){
mysqli_select_db($l, "db");
$query = "CREATE TABLE msgData (ID int(11) AUTO_INCREMENT,
sName varchar(255) NOT NULL, sEmail varchar(255) NOT NULL,
sSubject varchar(255) NOT NULL, sMessage varchar(3000) NOT NULL,
dateEntered TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
PRIMARY KEY (ID))";
$result = mysqli_query($l, $query);
}else{
echo "Error creating database: " . mysqli_error() . ".\n";
}
}
}
function storeData($l){
$name = $_POST["dbname"];
$email = $_POST["dbemail"];
$subject = $_POST["dbsubject"];
$message = $_POST["dbmessage"];
$db_selected = mysqli_select_db($l, "luberlaw");
$sql = "INSERT INTO msgData (sName, sEmail, sSubject, sMessage) VALUES (?, ?, ?, ?)";
$stmt = mysqli_prepare($l, $sql);
$stmt->bind_param("ssss", $name, $email, $subject, $message);
$stmt->execute();
$stmt->close();
mysqli_close($l);
}
if(isset($_POST["name"])){
checkExists($link);
storeData($link);
}
//sendmail.php
<?php
function sendMail(){
$name = $_POST["name"];
$email = $_POST["email"];
$subject = "website message: " . $_POST["subject"];
$message = $_POST["message"];
$to = "websiteownersemail";
$body = "<html>
<head>
<title>website Message</title>
</head>
<body>
<table>
<tr>
<th>Name</th>
</tr>
<tr>
<td>$name</td>
</tr>
</table>
<p>$message</p>
</body>
</html>";
$headers[] = "MIME-Version: 1.0";
$headers[] = "Content-type: text/html; charset=iso-8859-1";
$headers[] = "Bcc: myemail"; //testing purposes
mail($to, $subject, $body, implode("\r\n", $headers));
}
if(isset($_POST["name"]))
sendMail();
?>
I expect both forms to submit, but clearly something isn't working correctly with form1. I originally just had isset($_POST) in my php files which would allow the database to be filled but the email sent to be empty. I put isset($_POST["name"]) as a test to see if form1 data was setting, which it wasn't.
Edit included sendmail and storedata php files
