JSFiddle - React, Tailwind, and code Playground

HTML

<form class="form" method="post" action="GetFbId.php">
     <h2>Registration</h2>

    <hr/>
    <label for="first_name">First Name:</label>
    <input type="text" name="first_name" id="first_name" required>
    <label for="last_name">Last Name:</label>
    <input type="text" name="last_name" id="last_name" required>
    <label for="city">City:</label>
    <input type="text" name="city" id="city" required>
    <label for="email">Email:</label>
    <input type="text" name="email" id="email" required>
    <input type="submit" name="register" id="register" value="Register">
</form>

JavaScript

$(document).ready(function () {

        $("#register").click(function () {
            event.preventDefault(); // <--  ADDED THIS LINE
            var first_name = $("#first_name").val();
            var last_name = $("#last_name").val();
            var city = $("#city").val();
            var email = $("#email").val();

            if (first_name == '' || last_name == '' || email == '' || city == '') {
                alert("Fill all fields.");
                return false; // <-- ADDED THIS LINE
            } else if ((first_name.length) < 3) {
                alert("Too short first name.");
                return false; // <-- ADDED THIS LINE
            } else if ((last_name.length) < 4) {
                alert("Too short last name.");
                return false; // <-- ADDED THIS LINE
            } else {
                $.post("GetFbId.php", {
                    first_name: first_name,
                    last_name: last_name,
                    city: city,
                    email: email
                },

                function (data) {
                    if (data == 'Success') {
                        $("form")[0].reset();
                    }
                    alert(data);
                });
            }

        });

    });