[Summary view] [Print] [Text view]

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