yui3_cascaded_dropdowns.js

YUI().use('event', 'node', function(Y) {
  Y.on('domready', cascadeFields);

  function unhide(cl) {
        //CHANGED
        Y.all('#mortgage_picker_form select.' + cl).setStyle('display', 'block');
  }

  function hide(cl) {
        //CHANGED
        Y.all('#mortgage_picker_form select.' + cl).setStyle('display', 'none');
  }

  function cascadeFields() {
    // detect when the selected value of the key dropdown changes
    Y.on("change", show_dependants, "#product_type");
  }
  
  function show_dependants(e) {
    //e.currentTarget is a Node reference, us it.
    var chosenOption = e.currentTarget;
    //Using .get here
    if (chosenOption.get('value') != 'Please Select..') {

        //NOT SURE WHAT THIS IS SUPPOSED TO BE RUNNING indexOf on

      // determine the 'type' of option chosen. ie mortgage, insurance or conveyancing
      var posUnderscore = chosenOption.indexOf('_');
      if (posUnderscore == -1) { // we didn't find the underscore delimiter 
         var option = chosenOption;
      } else {
         var option = chosenOption.substring(0,posUnderscore);
      }
      switch(option) {
        case 'mortgage':
          hide('protection');
          hide('conveyancing');
          break;
        case 'protection':
          hide('mortgage');
          hide('conveyancing');
          break;                  
        case 'conveyancing':
          hide('mortgage');         
          hide('protection');
          break;        
      }     
      unhide(option);
    }
  }  
});