CODEWITHSUNDEEP
javascriptjqueryformsdialog
Tyler Richardson
Tyler Richardson

Reputation: 309

Javascript forms. making 1 entry dependant on another

I have a form with multiple questions like: "do you 'A'", "if not, do you have 'B'?" rather than have all of these questions showing at the same time, which would take a lot of room, how can i use javascript to have the second form question pop up only if the answer to the first question is no? I'm using a radio buttons and checkboxes as my question input.

ALSO, im using a UI-jquery dialog box to display this form, is that going to change what I can do with the form or does that not make any difference?

Upvotes: 1

Views: 121

Answers (1)

Bic
Bic

Reputation: 3134

If you're using jquery-ui, I assume you have access to jQuery.

You can bind an onchange event to option a, and use the value of the option to dictate whether or not to show option b. Something like below:

$("#optionA").on("change", function () {
    if (this.value !== '') {
       $("#optionB").css('display', '');  // show the option
    }
    else {
       $("#optionB").css('display', 'none'); // hide the option
    }
});

The value of the form element will vary based on the type of the element (e.g. radio, checkbox, etc.), but the above code should get you in the realm of what you need.

Upvotes: 1

Related Questions