I'm currently building a form in HTML+CSS. As there are two forms in this I'll call "my form" for the one relevant to this question and "other form" for the form that has its own different solution
My form is intended to use only text inputs
<input type="text"> for the data input at this point.
For some data inserted in my form, depending on data that is inserted by other people in "other form", different information will be used from "my form" in the final output.
Here's an example-idea of how "my form" looks like:
I believe that it doesn't seem like that those (if A) and (If B) look like alternatives to each other.
Do not forget that condition
A and condition
B are only calculable at the time the other form is being answered. Also, one answer to my form will be used for multiple answers to the other form.
What are the "standard" ways without doing drastical changes I can apply to that construction to give the idea to whomever is filling that form that those two are actually mutually exclusive for each "final use" after "other form" is filled?
I already thought about...
- Using nested groups, but then there would be too many groups that would make the page huge with 1/3 of the page just to show the group namings.
- Using buttons to alternate but "Out of sight, out of mind" is a huge issue here because all fields must be filled.
- Side-by-side inputs but I need labels for them so that they can be properly identified.
Here's an image that tries to give a visual clue on how each part is interconnected.
I'll reiterate, I only need help about "my form". The rest is just to try placing you in the correct mindset. Also, due to my NDA, I'm not allowed to tell anything more, unfortunately...