I have created a form, as shown below that displays according to a switch statement. I am needing the inputs from the form submission to either be saved to a table in the WordPress Database or to be saved to a text file saved in the uploads section of the sites core files. However, when the form is submitted it is outputting empty values for the variables. What am I doing wrong? How can this be fixed? Thank you!
Code for the form's switch statement:
<?php
$host = 'https://' .$_SERVER["HTTP_HOST"] . $_SERVER["REQUEST_URI"];
switch ( $host ){
case 'https://example1.com/':
case 'https://example2.com/':
case 'https://example3.com/':
require 'pop-up-button.php';
echo '<button id="close" class="open-button" onclick="openForm()"></button>';
break;
default :
break;
}; ?>
Code for the form:
<html>
<style>
.h3{
text-align: center;
font-size: 24px;
padding: 10px;
color: white;
}
.box{
font-size: 20px;
padding: 20px;
color: white;
}
.input-label{
text-align: center;
font-size: 20px;
padding: 10px;
color: white;
}
.open-button {
width: 170px;
height: 60px;
background-color: transparent;
outline: none;
position: relative;
left: -168px;
top: 20px;
}
.form-popup {
display: none;
position: absolute;
top: 25%;
border: none;
z-index: 9;
background-color: #1e1e1e;
width: 100%;
padding: 20px;
border-radius: 20px;
text-align: center;
}
.form-popup input[type=text] {
width: 20%;
padding: 5px;
margin: 5px 0 22px 0;
border: none;
background: #FFFFFF;
}
.form-popup input:focus {
background-color: #FFFFFF;
outline: none;
}
.btn {
background-color: #DB2600;
border-radius: 9999px;
font-size: 24px;
width: 120px;
height: 45px;
transition: 0.3s;
color: white;
}
.btn:hover {
opacity: 1;
background-color: #000000;
}
.box input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.checkmark {
position: absolute;
height: 20px;
width: 20px;
background-color: white;
border-radius: 2px;
}
.box input:checked ~ .checkmark {
background-color: #DB2600;
}
.checkmark:after {
content: "";
position: absolute;
display: none;
}
.box input:checked ~ .checkmark:after {
display: block;
}
.box .checkmark:after {
left: 7px;
top: 3px;
width: 6px;
height: 12px;
border: solid white;
border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.column1 {
float: left;
width: 17%;
}
.column2 {
float: left;
width: 74%;
margin-top:-5px;
}
.row:after {
content: "";
display: table;
clear: both;
}
</style>
<body>
<!--
<div class="form-popup" id="Form">
<form method="POST" action="<?php echo $_SERVER['PHP_SELF'];?>">
<!--
<h3 class="h3">Form Statement</h3>
<!--
<label for="fname" class="input-label">First name:</label>
<input type="text" name="fname" id="fname" required/>
<!--
<label for="lname" class="input-label"> Last name:</label>
<input type="text" name="lname" id="lname" required/> <br> <br>
<!--
<div class="row">
<div class="column1" style="text-align: right;">
<label class="box" style="border-color: red;">
<input type="checkbox" name="consent" value="agreed" class="box" id="consent" required/>
</label></div>
<div class="column2" style="text-align: left;">
<label class="input-label"> I have read and understand the above statement.
</label>
</div>
</div>
<br><br>
<!--
<input type="submit" onclick = "submitForm()" class="btn">
</form>
</div>
<script>
function openForm() {
document.getElementById("Form").style.display = "block";
}
function submitForm() {
document.write = "<?php form_process() ?>";
}
</script>
</body>
</html>
PHP that processes the form: (contains statements for both Database insertions and writing to the text file, I truly only need one to work)
<?php
function form_process(){
$_POST = json_decode(file_get_contents("php://input"), true);
$FirstName = filter_input(INPUT_POST, "fname", FILTER_SANITIZE_STRING);
$LastName = filter_input(INPUT_POST, "lname", FILTER_SANITIZE_STRING);
$Consent = filter_input(INPUT_POST, "consent", FILTER_SANITIZE_STRING);
$Date = date("l, F jS, Y");
date_default_timezone_set("America/Chicago");
$Time = date("h:i:sa");
global $wpdb;
$mysqli = new mysqli("host", "usernme", "password", "database");
$table_name = $wpdb -> database . 'table';
$wpdb->insert($table_name, array('FirstName' => "$FirstName", 'LastName' => "$LastName", 'Consent' => "$Consent"));
$data = 'I, ' . $FirstName . ' ' . $LastName . ', ' . $Consent . ' to Form on ' . $Date . ' at ' . $Time . '.' . "\n";
$txtfile = "uploads/Form.txt";
$fp = fopen($txtfile, 'a+');
fwrite($fp, $data);
fclose($fp);
}
?>
What I have tried:
I have tried using GET and REQUEST and neither work. I also tried var_dump($_POST); and when that runs it acts as if the form is being processed before it is even run. Also the code worked when I was writing and testing it locally, it began giving me empty values once it was moved to WordPress.
Submit an article or tip