views/js/dependent.js

// $Id: dependent.js,v 1.8 2009/06/02 17:12:13 merlinofchaos Exp $
/**
 * @file dependent.js
 *
 * Written by dmitrig01 (Dmitri Gaskin) for Views; this provides dependent
 * visibility for form items in Views' ajax forms.
 *
 * To your $form item definition add:
 * - '#process' => array('views_process_dependency'),
 * - Add '#dependency' => array('id-of-form-item' => array(list, of, values, that, 
     make, this, item, show),
 *
 * Special considerations:
 * - radios are harder. Because Drupal doesn't give radio groups individual ids,
 *   use 'radio:name-of-radio' 
 *
 * - Checkboxes don't have their own id, so you need to add one in a div 
 *   around the checkboxes via #prefix and #suffix. You actually need to add TWO
 *   divs because it's the parent that gets hidden. Also be sure to retain the
 *   'expand_checkboxes' in the #process array, because the views process will
 *   override it.
 */

Drupal.Views = Drupal.Views || {};

Drupal.Views.dependent = { bindings: {}, activeBindings: {}, activeTriggers: [] };

Drupal.Views.dependent.inArray = function(array, search_term) {
  var i = array.length;
  if (i > 0) {
   do {
    if (array[i] == search_term) {
       return true;
    }
   } while (i--);
  }
  return false;
}


Drupal.Views.dependent.autoAttach = function() {
  // Clear active bindings and triggers.
  for (i in Drupal.Views.dependent.activeTriggers) {
    jQuery(Drupal.Views.dependent.activeTriggers[i]).unbind('change');
  }
  Drupal.Views.dependent.activeTriggers = [];
  Drupal.Views.dependent.activeBindings = {};
  Drupal.Views.dependent.bindings = {};

  if (!Drupal.settings.viewsAjax) {
    return;
  }

  // Iterate through all relationships
  for (id in Drupal.settings.viewsAjax.formRelationships) {

    // Drupal.Views.dependent.activeBindings[id] is a boolean, 
    // whether the binding is active or not.  Defaults to no.
    Drupal.Views.dependent.activeBindings[id] = 0;
    // Iterate through all possible values
    for(bind_id in Drupal.settings.viewsAjax.formRelationships[id].values) {
      // This creates a backward relationship.  The bind_id is the ID
      // of the element which needs to change in order for the id to hide or become shown.  
      // The id is the ID of the item which will be conditionally hidden or shown.
      // Here we're setting the bindings for the bind
      // id to be an empty array if it doesn't already have bindings to it
      if (!Drupal.Views.dependent.bindings[bind_id]) {
        Drupal.Views.dependent.bindings[bind_id] = [];
      }
      // Add this ID
      Drupal.Views.dependent.bindings[bind_id].push(id);
      // Big long if statement.
      // Drupal.settings.viewsAjax.formRelationships[id].values[bind_id] holds the possible values

      if (bind_id.substring(0, 6) == 'radio:') {
        var trigger_id = "input[name='" + bind_id.substring(6) + "']";
      }
      else {
        var trigger_id = '#' + bind_id;
      }

      Drupal.Views.dependent.activeTriggers.push(trigger_id);

      if (jQuery(trigger_id).attr('type') == 'checkbox') {
        $(trigger_id).parent().addClass('hidden-options');
      }

      var getValue = function(item, trigger) {
        if (item.substring(0, 6) == 'radio:') {
          var val = jQuery(trigger + ':checked').val();
        }
        else {
          switch (jQuery(trigger).attr('type')) {
            case 'checkbox':
              var val = jQuery(trigger).attr('checked') || 0;
              
              if (val) {
                $(trigger).parent().removeClass('hidden-options').addClass('expanded-options');
              }
              else {
                $(trigger).parent().removeClass('expanded-options').addClass('hidden-options');
              }
              
              break;
            default:
              var val = jQuery(trigger).val();
          }
        }
        return val;
      }

      var setChangeTrigger = function(trigger_id, bind_id) {
        // Triggered when change() is clicked.
        var changeTrigger = function() {
          var val = getValue(bind_id, trigger_id);

          for (i in Drupal.Views.dependent.bindings[bind_id]) {
            var id = Drupal.Views.dependent.bindings[bind_id][i];

            // Fix numerous errors
            if (typeof id != 'string') {
              continue;
            }

            // This bit had to be rewritten a bit because two properties on the
            // same set caused the counter to go up and up and up.
            if (!Drupal.Views.dependent.activeBindings[id]) {
              Drupal.Views.dependent.activeBindings[id] = {};
            }

            if (Drupal.Views.dependent.inArray(Drupal.settings.viewsAjax.formRelationships[id].values[bind_id], val)) {
              Drupal.Views.dependent.activeBindings[id][bind_id] = 'bind';
            }
            else {
              delete Drupal.Views.dependent.activeBindings[id][bind_id];
            }

            var len = 0;
            for (i in Drupal.Views.dependent.activeBindings[id]) {
              len++;
            }

            var object = jQuery('#' + id + '-wrapper');
            if (!object.size()) {
              object = jQuery('#' + id).parent();
            }

            if (Drupal.settings.viewsAjax.formRelationships[id].num <= len) {
              // Show if the element if criteria is matched
              object.show(0);
              object.addClass('dependent-options');
            }
            else {
              // Otherwise hide
              object.hide(0);
            }
          }
        }

        jQuery(trigger_id).change(function() {
          // Trigger the internal change function
          // the attr('id') is used because closures are more confusing
          changeTrigger(trigger_id, bind_id);
        });
        // Trigger initial reaction
        changeTrigger(trigger_id, bind_id);
      }
      setChangeTrigger(trigger_id, bind_id);
    }
  }
}

Drupal.behaviors.viewsDependent = function (context) {
  Drupal.Views.dependent.autoAttach();

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