Handling form submissions is a fundamental task in web development. PHP makes it easy to collect and process user input from forms. In this guide, we will explore three diverse examples that will help you understand how to manage form submissions effectively.
In this example, we’ll create a simple contact form that collects user information and validates the input before submission. This is a common use case for websites needing to gather user inquiries.
A contact form generally includes fields like name, email, and message. Proper validation ensures that the data is correctly formatted before it is processed.
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
\(name = htmlspecialchars(trim(\)_POST['name']));
\(email = htmlspecialchars(trim(\)_POST['email']));
\(message = htmlspecialchars(trim(\)_POST['message']));
// Validate input
if (empty(\(name) || empty(\)email) || empty($message)) {
echo "All fields are required!";
} elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
echo "Invalid email format!";
} else {
echo "Thank you, $name! Your message has been received.";
// Here you can add code to send the email or save the data to a database.
}
}
?>
<form method="post" action="">
<label for="name">Name:</label>
<input type="text" name="name" required><br>
<label for="email">Email:</label>
<input type="email" name="email" required><br>
<label for="message">Message:</label>
<textarea name="message" required></textarea><br>
<input type="submit" value="Submit">
</form>
htmlspecialchars to prevent XSS attacks by escaping HTML characters.This example demonstrates how to handle file uploads in a form submission scenario. This is particularly useful for websites that allow users to upload images, documents, or other files.
We’ll create a form that allows a user to upload a profile picture.
<?php
if (\(_SERVER["REQUEST_METHOD"] == "POST" && isset(\)_FILES['profile_picture'])) {
$target_dir = "uploads/";
\(target_file = \)target_dir . basename($_FILES["profile_picture"]["name"]);
$uploadOk = 1;
\(imageFileType = strtolower(pathinfo(\)target_file,PATHINFO_EXTENSION));
// Check if image file is an actual image or fake image
\(check = getimagesize(\)_FILES["profile_picture"]["tmp_name"]);
if($check !== false) {
echo "File is an image - " . $check["mime"] . ".";
} else {
echo "File is not an image.";
$uploadOk = 0;
}
// Check file size
if ($_FILES["profile_picture"]["size"] > 500000) {
echo "Sorry, your file is too large.";
$uploadOk = 0;
}
// Allow certain file formats
if(\(imageFileType != "jpg" && \)imageFileType != "png" && \(imageFileType != "jpeg" && \)imageFileType != "gif") {
echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
$uploadOk = 0;
}
// Check if $uploadOk is set to 0 by an error
if ($uploadOk == 0) {
echo "Sorry, your file was not uploaded.";
} else {
if (move_uploaded_file(\(_FILES["profile_picture"]["tmp_name"], \)target_file)) {
echo "The file " . htmlspecialchars(basename($_FILES["profile_picture"]["name"])) . " has been uploaded.";
} else {
echo "Sorry, there was an error uploading your file.";
}
}
}
?>
<form method="post" action="" enctype="multipart/form-data">
<label for="profile_picture">Upload Profile Picture:</label>
<input type="file" name="profile_picture" required><br>
<input type="submit" value="Upload">
</form>
uploads directory with appropriate permissions for file storage.In this last example, we will look at how to handle form submissions using AJAX. This allows for a seamless user experience without requiring the page to refresh. This method is widely used in modern web applications.
We will create a feedback form that submits data to the server using AJAX and displays a success message without reloading the page.
<!-- HTML Form -->
<form id="feedbackForm">
<label for="name">Name:</label>
<input type="text" name="name" required><br>
<label for="feedback">Feedback:</label>
<textarea name="feedback" required></textarea><br>
<input type="submit" value="Submit">
</form>
<div id="response"></div>
<!-- AJAX Script -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$('#feedbackForm').on('submit', function(e) {
e.preventDefault(); // Prevent default form submission
$.ajax({
type: "POST",
url: "process_feedback.php",
data: $(this).serialize(),
success: function(response) {
$('#response').html(response);
}
});
});
});
</script>
And here’s the process_feedback.php file handling the form submission:
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
\(name = htmlspecialchars(trim(\)_POST['name']));
\(feedback = htmlspecialchars(trim(\)_POST['feedback']));
// Process the feedback (e.g., save to database, send email)
echo "Thank you, $name! Your feedback has been submitted.";
}
?>
These examples of handling form submissions with PHP provide a solid foundation for processing user input effectively. Whether you’re building a simple contact form, enabling file uploads, or implementing AJAX for a better user experience, understanding these concepts will greatly enhance your web development skills.