JSFiddle - React, Tailwind, and code Playground

by alexseroshtan

HTML

<form action="" method="post" id="form">
    <input class="form-field" type="radio" value="1" name="q1"> 1
    <input class="form-field" type="radio" value="0" name="q1"> 0
    <br>
    <input class="form-field" type="radio" value="1" name="q2"> 1
    <input class="form-field" type="radio" value="0" name="q2"> 0
    <br>
    <input class="form-field" type="text" value="" name="qw">
    <br>
    <input id="submit" disabled type="submit" value="GO!">
</form>

JavaScript

$('.form-field').on('click keyup', function() {
    var groups = [];
    
    $(".form-field").each(function() {
        if (groups.indexOf(this.name) < 0) {
            groups.push(this.name);
        }
    });

    var notEmptyText = $('input:text').filter(function(){return $.trim($(this).val()) != '';}).length;
    
    if (groups.length == $(".form-field:checked").length + notEmptyText) {
        $('#submit').removeAttr('disabled');
    } else {
        $('#submit').attr("disabled", "disabled");
    }
});

$('#form').submit(function() {
    console.log('submit');
    return false;
});