JSFiddle - React, Tailwind, and code Playground

by eTiger13

JavaScript

$(document).ready(function() {
    $('#name, #email, #mobile, #residence').next().hide();

    $('#contactForm').submit(function(e) {
        var valid = true;
        if ($('#name').val() == '') {
            valid = false;
            $('#name').next().show();
        }
        else {
            $('#name').next().hide();
        }
        var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
        if ($('#email').val() == '') {
            valid = false;
            $('#email').next().show();
        }
        else {
            if (!emailReg.test($('#email').val())) {
                valid = false;
                $('#email').next().show();
            }
            else $('#email').next().hide();
        }
        if ($('#mobile').val() == '') {
            valid = false;
            $('#mobile').next().show();
        }
        else {
            $('#mobile').next().hide();
        }
        if ($('#residence').val() == '') {
            valid = false;
            $('#residence').next().show();
        }
        else {
            $('#residence').next().hide();
        }
        
        return valid;
    });
});