So I started looking at this and it turned into a pretty interesting problem. I think I went a bit overboard with the solution I came up with but I'll post it and get your feedback.
Assume you have the following Dropdown fields each with only Yes and No for values. When the value is Yes, the dependent fields are visible and when the value is No the dependent fields are hidden.
0) Do you want cake?
1) Do you want ice cream with your cake?
2) Do you want chocolate ice cream?
2) Do you want vanilla ice cream?
1) Do you want a donut?
It all started with the need to track the dependencies between fields in some way. I immediately thought of creating a big JSON object which would look like a tree but it soon became kinda unmanageable once you get a few levels deep. Instead I created a fluent
API to make it easier and more readable:
var cakeTree = new SPUtilityTree('Do you want cake?');
// add two dependencies on 'Do you want cake?' with different values
cakeTree.whenField('Do you want cake?').hasValue('Yes')
.showFields(['Do you want ice cream with your cake?']);
cakeTree.whenField('Do you want cake?').hasValue('No')
.showFields(['Do you want a donut?']);
// add two dependencies on 'Do you want ice cream with your cake?' with same value
cakeTree.whenField('Do you want ice cream with your cake?').hasValue('Yes').showFields([
'Do you want chocolate ice cream?',
'Do you want vanilla ice cream?'
// done adding additional field dependencies
// build the tree which prints it out and initializes the form
// dropdown fields are now hidden automatically based on the selection!
Behind the scenes, it builds a tree to track dependencies. This works pretty good because I can always iterate through the tree using recursion. I quickly ran into a couple problems though.
First, the form has to be initialized in case of the EditForm. If the dependency is only triggered when a field changes then it will only work on NewForm.
Second, changing the value for a field must trigger a re-evaluation of all the child dependencies.
Anywho... if you want to look at the code,
here is a standalone example
the tree code is here
Let me know what you think.