Mercurial > hg > rr-repo
comparison sites/all/modules/ctools/js/auto-submit.js @ 0:ff03f76ab3fe
initial version
author | danieleb <danielebarchiesi@me.com> |
---|---|
date | Wed, 21 Aug 2013 18:51:11 +0100 |
parents | |
children |
comparison
equal
deleted
inserted
replaced
-1:000000000000 | 0:ff03f76ab3fe |
---|---|
1 (function($){ | |
2 /** | |
3 * To make a form auto submit, all you have to do is 3 things: | |
4 * | |
5 * ctools_add_js('auto-submit'); | |
6 * | |
7 * On gadgets you want to auto-submit when changed, add the ctools-auto-submit | |
8 * class. With FAPI, add: | |
9 * @code | |
10 * '#attributes' => array('class' => array('ctools-auto-submit')), | |
11 * @endcode | |
12 * | |
13 * If you want to have auto-submit for every form element, | |
14 * add the ctools-auto-submit-full-form to the form. With FAPI, add: | |
15 * @code | |
16 * '#attributes' => array('class' => array('ctools-auto-submit-full-form')), | |
17 * @endcode | |
18 * | |
19 * If you want to exclude a field from the ctool-auto-submit-full-form auto submission, | |
20 * add the class ctools-auto-submit-exclude to the form element. With FAPI, add: | |
21 * @code | |
22 * '#attributes' => array('class' => array('ctools-auto-submit-exclude')), | |
23 * @endcode | |
24 * | |
25 * Finally, you have to identify which button you want clicked for autosubmit. | |
26 * The behavior of this button will be honored if it's ajaxy or not: | |
27 * @code | |
28 * '#attributes' => array('class' => array('ctools-use-ajax', 'ctools-auto-submit-click')), | |
29 * @endcode | |
30 * | |
31 * Currently only 'select', 'radio', 'checkbox' and 'textfield' types are supported. We probably | |
32 * could use additional support for HTML5 input types. | |
33 */ | |
34 | |
35 Drupal.behaviors.CToolsAutoSubmit = { | |
36 attach: function(context) { | |
37 // 'this' references the form element | |
38 function triggerSubmit (e) { | |
39 var $this = $(this); | |
40 if (!$this.hasClass('ctools-ajaxing')) { | |
41 $this.find('.ctools-auto-submit-click').click(); | |
42 } | |
43 } | |
44 | |
45 // the change event bubbles so we only need to bind it to the outer form | |
46 $('form.ctools-auto-submit-full-form', context) | |
47 .add('.ctools-auto-submit', context) | |
48 .filter('form, select, input:not(:text, :submit)') | |
49 .once('ctools-auto-submit') | |
50 .change(function (e) { | |
51 // don't trigger on text change for full-form | |
52 if ($(e.target).is(':not(:text, :submit, .ctools-auto-submit-exclude)')) { | |
53 triggerSubmit.call(e.target.form); | |
54 } | |
55 }); | |
56 | |
57 // e.keyCode: key | |
58 var discardKeyCode = [ | |
59 16, // shift | |
60 17, // ctrl | |
61 18, // alt | |
62 20, // caps lock | |
63 33, // page up | |
64 34, // page down | |
65 35, // end | |
66 36, // home | |
67 37, // left arrow | |
68 38, // up arrow | |
69 39, // right arrow | |
70 40, // down arrow | |
71 9, // tab | |
72 13, // enter | |
73 27 // esc | |
74 ]; | |
75 // Don't wait for change event on textfields | |
76 $('.ctools-auto-submit-full-form input:text, input:text.ctools-auto-submit', context) | |
77 .filter(':not(.ctools-auto-submit-exclude)') | |
78 .once('ctools-auto-submit', function () { | |
79 // each textinput element has his own timeout | |
80 var timeoutID = 0; | |
81 $(this) | |
82 .bind('keydown keyup', function (e) { | |
83 if ($.inArray(e.keyCode, discardKeyCode) === -1) { | |
84 timeoutID && clearTimeout(timeoutID); | |
85 } | |
86 }) | |
87 .keyup(function(e) { | |
88 if ($.inArray(e.keyCode, discardKeyCode) === -1) { | |
89 timeoutID = setTimeout($.proxy(triggerSubmit, this.form), 500); | |
90 } | |
91 }) | |
92 .bind('change', function (e) { | |
93 if ($.inArray(e.keyCode, discardKeyCode) === -1) { | |
94 timeoutID = setTimeout($.proxy(triggerSubmit, this.form), 500); | |
95 } | |
96 }); | |
97 }); | |
98 } | |
99 } | |
100 })(jQuery); |