yui3_cascaded_dropdowns.js

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

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

  function hide(cl) {
     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 to the #product_type select
    var optionParts = e.currentTarget.get('value').split('_');
    switch(optionParts[0]) {
      case 'mortgage':
        hide('protection');
        hide('conveyancing');
        break;
      case 'protection':
        hide('mortgage');
        hide('conveyancing');
        break;                  
      case 'conveyancing':
        hide('mortgage');         
        hide('protection');
        break;
      default:
        alert('Error: option could not be determined. Script=product_picker_cascading_form_fields.js');
        return;
        break;                  
    }     
    unhide(optionParts[0]);
  }  
});