[Summary view] [Print] [Text view]

   1  // $Id: dependent.js,v 1.4.2.2 2009/10/05 23:38:33 merlinofchaos Exp $
   2  /**
   3   * @file
   4   *
   5   * Written by dmitrig01 (Dmitri Gaskin) for CTools; this provides dependent
   6   * visibility for form items in CTools' ajax forms.
   7   *
   8   * To your $form item definition add:
   9   * - '#process' => array('CTools_process_dependency'),
  10   * - Add '#dependency' => array('id-of-form-item' => array(list, of, values, that,
  11       make, this, item, show),
  12   *
  13   * Special considerations:
  14   * - radios are harder. Because Drupal doesn't give radio groups individual ids,
  15   *   use 'radio:name-of-radio'
  16   *
  17   * - Checkboxes don't have their own id, so you need to add one in a div
  18   *   around the checkboxes via #prefix and #suffix. You actually need to add TWO
  19   *   divs because it's the parent that gets hidden. Also be sure to retain the
  20   *   'expand_checkboxes' in the #process array, because the CTools process will
  21   *   override it.
  22   */
  23  
  24  (function ($) {
  25    Drupal.CTools = Drupal.CTools || {};
  26    Drupal.CTools.dependent = {};
  27  
  28    Drupal.CTools.dependent.bindings = {};
  29    Drupal.CTools.dependent.activeBindings = {};
  30    Drupal.CTools.dependent.activeTriggers = [];
  31  
  32    Drupal.CTools.dependent.inArray = function(array, search_term) {
  33      var i = array.length;
  34      if (i > 0) {
  35       do {
  36        if (array[i] == search_term) {
  37           return true;
  38        }
  39       } while (i--);
  40      }
  41      return false;
  42    }
  43  
  44  
  45    Drupal.CTools.dependent.autoAttach = function() {
  46      // Clear active bindings and triggers.
  47      for (i in Drupal.CTools.dependent.activeTriggers) {
  48        jQuery(Drupal.CTools.dependent.activeTriggers[i]).unbind('change');
  49      }
  50      Drupal.CTools.dependent.activeTriggers = [];
  51      Drupal.CTools.dependent.activeBindings = {};
  52      Drupal.CTools.dependent.bindings = {};
  53  
  54      if (!Drupal.settings.CTools) {
  55        return;
  56      }
  57  
  58      // Iterate through all relationships
  59      for (id in Drupal.settings.CTools.dependent) {
  60  
  61        // Drupal.CTools.dependent.activeBindings[id] is a boolean,
  62        // whether the binding is active or not.  Defaults to no.
  63        Drupal.CTools.dependent.activeBindings[id] = 0;
  64        // Iterate through all possible values
  65        for(bind_id in Drupal.settings.CTools.dependent[id].values) {
  66          // This creates a backward relationship.  The bind_id is the ID
  67          // of the element which needs to change in order for the id to hide or become shown.
  68          // The id is the ID of the item which will be conditionally hidden or shown.
  69          // Here we're setting the bindings for the bind
  70          // id to be an empty array if it doesn't already have bindings to it
  71          if (!Drupal.CTools.dependent.bindings[bind_id]) {
  72            Drupal.CTools.dependent.bindings[bind_id] = [];
  73          }
  74          // Add this ID
  75          Drupal.CTools.dependent.bindings[bind_id].push(id);
  76          // Big long if statement.
  77          // Drupal.settings.CTools.dependent[id].values[bind_id] holds the possible values
  78  
  79          if (bind_id.substring(0, 6) == 'radio:') {
  80            var trigger_id = "input[name='" + bind_id.substring(6) + "']";
  81          }
  82          else {
  83            var trigger_id = '#' + bind_id;
  84          }
  85  
  86          Drupal.CTools.dependent.activeTriggers.push(trigger_id);
  87  
  88  
  89          var getValue = function(item, trigger) {
  90            if (item.substring(0, 6) == 'radio:') {
  91              var val = jQuery(trigger + ':checked').val();
  92            }
  93            else {
  94              switch (jQuery(trigger).attr('type')) {
  95                case 'checkbox':
  96                  var val = jQuery(trigger).attr('checked') || 0;
  97                  break;
  98                default:
  99                  var val = jQuery(trigger).val();
 100              }
 101            }
 102            return val;
 103          }
 104  
 105          var setChangeTrigger = function(trigger_id, bind_id) {
 106            // Triggered when change() is clicked.
 107            var changeTrigger = function() {
 108              var val = getValue(bind_id, trigger_id);
 109  
 110              for (i in Drupal.CTools.dependent.bindings[bind_id]) {
 111                var id = Drupal.CTools.dependent.bindings[bind_id][i];
 112  
 113                // Fix numerous errors
 114                if (typeof id != 'string') {
 115                  continue;
 116                }
 117  
 118                // This bit had to be rewritten a bit because two properties on the
 119                // same set caused the counter to go up and up and up.
 120                if (!Drupal.CTools.dependent.activeBindings[id]) {
 121                  Drupal.CTools.dependent.activeBindings[id] = {};
 122                }
 123  
 124                if (Drupal.CTools.dependent.inArray(Drupal.settings.CTools.dependent[id].values[bind_id], val)) {
 125                  Drupal.CTools.dependent.activeBindings[id][bind_id] = 'bind';
 126                }
 127                else {
 128                  delete Drupal.CTools.dependent.activeBindings[id][bind_id];
 129                }
 130  
 131                var len = 0;
 132                for (i in Drupal.CTools.dependent.activeBindings[id]) {
 133                  len++;
 134                }
 135  
 136                var object = jQuery('#' + id + '-wrapper');
 137                if (!object.size()) {
 138                  object = jQuery('#' + id).parent();
 139                }
 140  
 141                if (Drupal.settings.CTools.dependent[id].type == 'disable') {
 142                  if (Drupal.settings.CTools.dependent[id].num <= len) {
 143                    // Show if the element if criteria is matched
 144                    object.attr('disabled', false);
 145                    object.children().attr('disabled', false);
 146                  }
 147                  else {
 148                    // Otherwise hide. Use css rather than hide() because hide()
 149                    // does not work if the item is already hidden, for example,
 150                    // in a collapsed fieldset.
 151                    object.attr('disabled', true);
 152                    object.children().attr('disabled', true);
 153                  }
 154                }
 155                else {
 156                  if (Drupal.settings.CTools.dependent[id].num <= len) {
 157                    // Show if the element if criteria is matched
 158                    object.show(0);
 159                  }
 160                  else {
 161                    // Otherwise hide. Use css rather than hide() because hide()
 162                    // does not work if the item is already hidden, for example,
 163                    // in a collapsed fieldset.
 164                    object.css('display', 'none');
 165                  }
 166                }
 167              }
 168            }
 169  
 170            jQuery(trigger_id).change(function() {
 171              // Trigger the internal change function
 172              // the attr('id') is used because closures are more confusing
 173              changeTrigger(trigger_id, bind_id);
 174            });
 175            // Trigger initial reaction
 176            changeTrigger(trigger_id, bind_id);
 177          }
 178          setChangeTrigger(trigger_id, bind_id);
 179        }
 180      }
 181    }
 182  
 183    Drupal.behaviors.CToolsDependent = function (context) {
 184      Drupal.CTools.dependent.autoAttach();
 185  
 186      // Really large sets of fields are too slow with the above method, so this
 187      // is a sort of hacked one that's faster but much less flexible.
 188      $("select.ctools-master-dependent:not(.ctools-processed)")
 189        .addClass('ctools-processed')
 190        .change(function() {
 191          var val = $(this).val();
 192          if (val == 'all') {
 193            $('.ctools-dependent-all').show(0);
 194          }
 195          else {
 196            $('.ctools-dependent-all').hide(0);
 197            $('.ctools-dependent-' + val).show(0);
 198          }
 199        })
 200        .trigger('change');
 201    }
 202  })(jQuery);