Golang React JS Technology Blog

jQuery simple form with name and email validations

Example

<!DOCTYPE html>
<html>
<head>
<style>
body {
    padding: 20px;
}

label {
    display: block;
}

input.error {
    border: 1px solid red;
}

label.error {
    font-weight: normal;
    color: red;
}

button {
    display: block;
    margin-top: 20px;
}
</style>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.js"></script>
<script>
$(document).ready(function () {
    $("#form").validate({
        rules: {
            "name": {
                required: true,
                minlength: 5
            },
            "email": {
                required: true,
                email: true
            }
        },
        messages: {
            "name": {
                required: "Please, enter a name"
            },
            "email": {
                required: "Please, enter an email",
                email: "Email is invalid"
            }
        },
        submitHandler: function (form) {
            alert('Form Pass All Validations');
            return false;
        }
    });

});
</script>
</head>
<body>
<form id="form" method="post" action="#">
    <label for="name">Name</label>
    <input type="text" name="name" id="name" />
    <label for="email">Email</label>
    <input type="email" name="email" id="email" />
    <button type="submit">Submit</button>
</form>
</body>
</html>
Most Helpful This Week
JavaScript sort multi dimensional array on specific columns jQuery Show or Hide text on button click JavaScript HTML5 Validation for name and email field jQuery get the coordinates of div clicked Using jQuery add new table row on click ES6 method of declaration multiple variables in one line How to declare and print value of variable in JavaScript? What's the difference between let and var? jQuery example of scroll to top JavaScript check if first string contains all characters of second string