Skip to content
PHP Logo

How can JavaScript be utilized to prevent form submission and file upload when implementing a preview functionality in PHP forms?

To prevent form submission and file upload when implementing a preview functionality in PHP forms, you can use JavaScript to intercept the form submission event, prevent the default behavior, and handle the preview functionality. This can be achieved by attaching an event listener to the form submission event and calling event.preventDefault() to stop the form from being submitted.

php
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // Handle preview functionality here
    echo "Preview mode activated";
    exit; // Prevent form submission and file upload
}
?>

<!DOCTYPE html>
<html>
<head>
    <title>Preview Form</title>
</head>
<body>
    <form id="previewForm" method="post" action="">
        <input type="text" name="name" placeholder="Enter your name" required><br><br>
        <input type="email" name="email" placeholder="Enter your email" required><br><br>
        <input type="submit" value="Preview">
    </form>

    <script>
        document.getElementById('previewForm').addEventListener('submit', function(event) {
            // Prevent form submission
            event.preventDefault();
            // Handle preview functionality using JavaScript
            console.log('Preview mode activated');
        });
    </script>
</body>
</html>