JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<form id="myform">  
     <input type="text" name="field1" />  <br/>  
    <br />     <input type="text" id="toggleInput" name="toggleInputName" style="display:none" />
<input type="button" id="toggleButton" value="Toggle Disabled" />
     <input type="submit" />
</form>

JavaScript

$(document).ready(function() {
 
    $('#myform').validate({
		onblur: true,
        ignore: ":disabled",
        rules: {
            field1: {
                required: true,
                minlength: 5
            },
            field2: {
                required: true,
                minlength: 5
            },
			toggleInputName: {
                required: true,
                minlength: 5
            }
        },
        submitHandler: function(form) { // for demo
            alert('valid form');
            return false;
        }
    });
    
});
(function($) {
    $.fn.toggleDisabled = function() {
        return this.each(function() {
            var $this = $(this);
            if ($this.attr('disabled')) $this.removeAttr('disabled').show();
            else $this.attr('disabled', 'disabled').hide();
        });
    };
})(jQuery);

$(function() {
    $('#toggleButton').click(function() {
        $('#toggleInput').toggleDisabled();
    });
});