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