How to display message in HTML Tag with PHP in a function

Issue

I have this PHP form validator that is also hooked up to a mail function and to keep things organized I did the form validation in a separate function that is being called when the form is submitted.

Now I have this problem that I don’t know how to display the error message when a field is empty in the HTML form.

Can anyone help? Thank you in advance.

I’m also pretty new to PHP and the whole thing.

PHP:

<?php
// Validation function
function validation($name, $email, $message) {
    // Searching for every empty POST variable
    // And if empty push into $error array
    if (empty($name)) {
        array_push($errors, "Name");
    }
    if (empty($email)) {
        array_push($errors, "E-Mail");
    } else if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        $mail_error = " and E-Mail must be correct/filled out.";
    }
    if (empty($message)) {
        array_push($errors, "Message");
    }
    // Combining all index of array to one final string
    $final = implode(", ", $errors);
    // Adding additional string to final
    $final .= " is not allowed to be empty." . $mail_error . "\n";
    return $final;
}

if (isset($_POST["submit"])) {
    // Defining POST variables for validation and mail content
    $fname = $_POST["fname"];
    $femail = $_POST["femail"];
    $fmessage = $_POST["fmessage"];

    // Defining variable for pushing errors for validation
    $errors = array();

    // Calling function
    validation($fname, $femail, $fmessage);
}

HTML:

<form name="main-form" action="" method="post" class="row g-3 pt-1 p-5 bg-custom">
    <div class="input-group mb-3 col-md-6">
        <span class="input-group-text">Name</span>
            <input name="fname" type="text" class="form-control me-3 " placeholder="Name"        aria-label="Name">
            <span class="input-group-text">E-Mail</span>
            <input name="femail" type="email" class="form-control" placeholder="example@mail.com"aria-label="example@mail.com">
    </div>
    <div class="input-group mb-3 col-md-12 col-sm-6">
        <span class="input-group-text">Message</span>
        <textarea name="fmessage" type="text" class="form-control"></textarea>
    </div>
    <!-- The error message if a field is empty should be displayed here: -->
    <p id="error-message" class="text-center text-danger"><?php echo($final); ?></p>
    <div class="col-md-12 text-center">
        <button class="btn btn-primary me-2" id="btn-send" style="width: 30%;" class="btn btn-primary me-2" type="submit" name="submit">Send</button>
    </div>
</form>

Solution

<?php
// Validation function
function validation($name, $email, $message) {
    $errors = [];
    $final = "";
    // Searching for every empty POST variable
    // And if empty push into $error array
    if (empty($name)) {
        array_push($errors, "Name");
    }
    if (empty($email)) {
        array_push($errors, "E-Mail");
    } else if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        $mail_error = " and E-Mail must be correct/filled out.";
    }
    if (empty($message)) {
        array_push($errors, "Message");
    }
    // Combining all index of array to one final string
    $final = implode(", ", $errors);
    // Adding additional string to final
    $final .= " is not allowed to be empty." . $mail_error . "\n";
    return $final;
}

if (isset($_POST["submit"])) {
    // Defining POST variables for validation and mail content
    $fname = $_POST["fname"];
    $femail = $_POST["femail"];
    $fmessage = $_POST["fmessage"];

    // Defining variable for pushing errors for validation
    

    // Calling function
    $error = validation($fname, $femail, $fmessage);
}

HTML

<form name="main-form" action="" method="post" class="row g-3 pt-1 p-5 bg-custom">
    <div class="input-group mb-3 col-md-6">
        <span class="input-group-text">Name</span>
            <input name="fname" type="text" class="form-control me-3 " placeholder="Name"        aria-label="Name">
            <span class="input-group-text">E-Mail</span>
            <input name="femail" type="email" class="form-control" placeholder="example@mail.com"aria-label="example@mail.com">
    </div>
    <div class="input-group mb-3 col-md-12 col-sm-6">
        <span class="input-group-text">Message</span>
        <textarea name="fmessage" type="text" class="form-control"></textarea>
    </div>
    <!-- The error message if a field is empty should be displayed here: -->
    <p id="error-message" class="text-center text-danger"><?=if(isset($error)); $error : "";?></p>
    <div class="col-md-12 text-center">
        <button class="btn btn-primary me-2" id="btn-send" style="width: 30%;" class="btn btn-primary me-2" type="submit" name="submit">Send</button>
    </div>
</form>

$error = validation($fname, $femail, $fmessage); store data in variable and
isset() use to check variable exist or not

Answered By – Uttam Nath

Answer Checked By – Katrina (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.