Here is the entire code (minus the extra crap obviously) :
Now, I will break it down into each part. First lets start with the form part, and again this is not the entire form but rather just the 2 drop downs that we are working with.
So we have the two drop downs in our form. The first drop down has the values from the controller as @share_types. So based on the selected value of the :share_type we will have different set of options for select for the second drop down. For this we will need to check the selected value of the :share_type. The first thing that we do is look for the change of that selection.
First we call the initSubOptions() function on document ready. This function watches the #selected_share_type drop down for it to change. When it sees that drop down change it takes the value of it ($(this).val()) and passes that to the populateSubOptions function.
The populateSubOptions() function looks at the selected value of the first drop down. There are only 3 options that will ever be present in the first drop down and we have just two cases, if it is “share_across” or either of the other options. Our if statement looks to see if the value is “share_across” and if it is it calls .empty() on the #share_exp_dates select and then appends to it the optionFromArray(share_across_options) otherwise it appends the optionFromArray(share_down_options).
The optionsFromArray function creates the options for select based on which array it is passed. The two array options are defined based on the values that are passed in from the controller; either @share_across_dates or @share_down_dates.
It then runs thru the array and creates the option values. The @options for @share_across_dates is an array of arrays:
[[‘1 Week’, ‘one_week’], [‘2 Weeks’, ‘two_weeks’], [‘3 Weeks’, ‘three_weeks’], [‘4 Weeks’, ‘four_weeks’], [‘5 Weeks’, ‘five_weeks’], [‘6 Weeks’, ‘six_weeks’] ]
I am sure that there may be a better/easier way out there, but this worked for me.