JSFiddle - React, Tailwind, and code Playground

by ezmilhouse

HTML

<form method="post" action="post.php">
    <input type="text" name="" value="" />
    <label>Name</label>
    <div></div>
</form>

CSS

.valid {
    color: green;
}

.invalid {
    color: red;
}

JavaScript

$('form').live('submit', function(evt){
    if ( $('input', this).val() === "" ) {
        evt.preventDefault();
        alert('Filed is required!');
    }
});

var min = 3;
$('input').live('keyup change', function(){
    if ($(this).val().length < min) {
        $('div').html('<span class="invalid">min. 3 characters.</span>');
    } else {
        $('div').html('<span class="valid">ok!</span>');
    }
});