JSFiddle - React, Tailwind, and code Playground

by anAgent

HTML

<form onsubmit="validate();" action="" method="POST">
<input type="text" value=""/>
<input type="text" value=""/>
<input type="submit" value="Post">
</form>

CSS

.input-validation-error{
  background-color:red;
  border: 1 solid red;    
    
}

JavaScript

function validate() {
   var inputs = document.getElementsByTagName("input");
    var status = true;
    for (var i = 0; i < inputs.length; i++) {
        var me = inputs[i];
        console.log("Value: " + me.value);
        if(me.value == "") {
            console.log("missing data");
            me.className = "input-validation-error";
            status  = false
        }
    }  
    console.log(status);
    return status;
}