Hide Submit Button Unless all Radio Options are “Yes”

Please note that this is now available as a plugin for easier installation. While you can use this document as a reference, the recommended method to add this functionality is through the plugin installation wizard. Learn more about plugins here. 

Since submit button display rules do not currently have the functionality to hide the submit button, this solution will allow you to hide the submit button from view on the page unless all options of yes are selected.

It is important to note that, if you wish to fully prevent users from submitting a form under certain cases, validation rules should be used. While hiding the submit button will prevent many users from submitting a form, if a user knows how to, they can still change the page HTML to access the button. You can certainly combine this solution with validation rules to fully ensure that a form cannot be submitted in your case.

Step 1

Add the class of "radio" to each radio field in your form.

Step 2

In the options tab of your form add the class "radio-hide" to the submit button CSS class. 

Step 3

Hover over the info icon of your form component to get the component ID.

Step 4

Add the following code to the JavaScript tab of your page. 

var check = function(vals, numVals) {
    var x, status = 0;
    for (x of vals) {
        if (x.value == "Yes") {
            status++;
        }
    }
    if (status != numVals) {
        $(".radio-hide").hide();
    } else {
        $(".radio-hide").show();
    }
};

TB.render('component_3', function(data) {
            var options = $(".radio .tb-radio"),
                numOptions = $(".radio").length;
            check($(".radio .selected input"), numOptions);
            options.click(function() {
                        if ($("input", this)[0].value == "Yes") {
                            $(this).addClass("selected");
                        } else {
                            $(this.previousElementSibling).removeClass("selected");
                        }

Remember to change the component ID in the code to the component ID you found in step 3.

Original Community Post:

Hide Submit Button Unless all Radio Options are "Yes" - Community Discussions / Tips and Tricks - Tadabase Community