root / drupal7 / sites / all / modules / ctools / js / auto-submit.js @ f0456308
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); |