JSFiddle - React, Tailwind, and code Playground

by Craig Martin

HTML

<form action="https://www.courtofpublicopinion.com/index.php?option=com_chronoforms&amp;case_number=100052&amp;vf=VF-400&amp;chronoform=JurorVerdict&amp;event=submit" name="JurorVerdict" id="chronoform_JurorVerdict" method="post" class="Chronoform hasValidation">
    <div id="welcome">Hi, demo Your Juror Badge ID: 741</div>
    <div id="formcont">
        
<h1>CoPO Verdict Form</h1>
        <hr>
        <div class="verdictformyes-no">
            <p class="question">1. Was Tom Def negligent?</p>
            <p class="answercont">
                <select required="">
                    <option value="" disabled="" selected="">Select...</option>
                    <option value="Yes">Yes</option>
                    <option value="No">No</option>
                </select>
            </p><span class="answercont"><span class="qidval">2568</span></span><span class="ftcont"><input class="form_type" type="hidden" name="form_type" value="VF-400"></span>
        </div>
        <div class="verdictforminstructions">
            <p class="question">If your answer to question 1 is yes, then answer question 2. If you answered no, stop here, answer no further questions, and have the presiding juror sign and date this form.</p>
            <p class="answercont">
            </p><span class="answercont"><span class="qidval">2569</span></span><span class="ftcont"><input class="form_type" type="hidden" name="form_type" value="VF-400"></span>
        </div>
        <div class="verdictformyes-no">
            <p class="question">2. Was Tom Def’s negligence a substantial factor incausing harm to Joe Pla?</p>
            <p class="answercont">
                <select required="">
                    <option value="" disabled="" selected="">Select...</option>
                    <option value="Yes">Yes</option>
                    <option value="No">No</option>
                </select>
            </p><span class="answercont"><span class="qidval">2570</span></span><span...

JavaScript

jQuery('.answercont').bind('keyup change', function(){
    var show = true;
    // Check each child input for data.
    jQuery('.answercont').children('input').each(function(i){
        if(jQuery(this).val().length==0){
            show = false;
        };
    });

    // If no options are selected in the "Select" element, set [show] flag to false.
    if((jQuery('.answercont select :selected').length==0 || jQuery('.answercont  select :selected').val().length==0)){
        show = false;
    };

    // Hide or show the necessary elements based on the [show] flag.
    if(show){
        if(document.getElementById("saveSignature").hasAttribute("src")){ 
        jQuery('#saveallcont').show();
        }
    } else {
        jQuery('#saveallcont').hide();
    }
});