JSFiddle - React, Tailwind, and code Playground

by Mark Evans

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/jquery.validate.js"></script>
<form id="myform">
    <label for="name">enter your name:</label>
    <div><input type="text" name="name" id="name" onkeyup="namechange();"/></div>
    <label for="name">enter your favorite color:</label>
    <div><input type="text" name="fav color" id="color"/></div>
    <button disabled>Submit</button>
</form>

JavaScript

$( document ).ready(function form_validation ()
{
    alert("validate");
    $("#myform").validate(
        {
            debug: true,
            rules: {
                name: "required",
                color: "required"
            },
            submitHandler: function (form) {
                form_submit();
            }
        }
        
    );
    $("#name").on('change keydown paste input', 
                        namechange
                    );
});

function form_submit ()
{
    alert("submit the form");
}

function namechange()
{
    $("button").prop("disabled", false);
}