JSFiddle - React, Tailwind, and code Playground

by thefourtheye

HTML

<form id="formId" name="myForm" action="mailto:" method="post">first field:
    <input type="text" name="first">
    </br>second field:
    <input type="text" name="second">
    </br>third field:
    <input type="text" name="third">
    </br>fourth field:
    <input type="text" name="fourth">
    </br>
    <input type="submit" value="Submit">
</form>

JavaScript

$(document).ready(function () {
    function validateForm() {
        var form = document.getElementById('formId');
        for (i = 0; i < form.childNodes.length; i++) {
            if (form.childNodes[i].tagName != 'INPUT' || typeof form.childNodes[i].value == "undefined") continue;
            else {
                var x = form.childNodes[i].value;
                if (x == null || x == "") {
                    alert("please fill out all fields");
                    return false;
                }
            }
        }
    }
    $('#formId').on('submit', validateForm);
});