summaryrefslogtreecommitdiff
path: root/sites/all/modules/ctools/js/auto-submit.js
diff options
context:
space:
mode:
Diffstat (limited to 'sites/all/modules/ctools/js/auto-submit.js')
-rw-r--r--sites/all/modules/ctools/js/auto-submit.js100
1 files changed, 100 insertions, 0 deletions
diff --git a/sites/all/modules/ctools/js/auto-submit.js b/sites/all/modules/ctools/js/auto-submit.js
new file mode 100644
index 000000000..a3e9aa42a
--- /dev/null
+++ b/sites/all/modules/ctools/js/auto-submit.js
@@ -0,0 +1,100 @@
+(function($){
+/**
+ * To make a form auto submit, all you have to do is 3 things:
+ *
+ * ctools_add_js('auto-submit');
+ *
+ * On gadgets you want to auto-submit when changed, add the ctools-auto-submit
+ * class. With FAPI, add:
+ * @code
+ * '#attributes' => array('class' => array('ctools-auto-submit')),
+ * @endcode
+ *
+ * If you want to have auto-submit for every form element,
+ * add the ctools-auto-submit-full-form to the form. With FAPI, add:
+ * @code
+ * '#attributes' => array('class' => array('ctools-auto-submit-full-form')),
+ * @endcode
+ *
+ * If you want to exclude a field from the ctool-auto-submit-full-form auto submission,
+ * add the class ctools-auto-submit-exclude to the form element. With FAPI, add:
+ * @code
+ * '#attributes' => array('class' => array('ctools-auto-submit-exclude')),
+ * @endcode
+ *
+ * Finally, you have to identify which button you want clicked for autosubmit.
+ * The behavior of this button will be honored if it's ajaxy or not:
+ * @code
+ * '#attributes' => array('class' => array('ctools-use-ajax', 'ctools-auto-submit-click')),
+ * @endcode
+ *
+ * Currently only 'select', 'radio', 'checkbox' and 'textfield' types are supported. We probably
+ * could use additional support for HTML5 input types.
+ */
+
+Drupal.behaviors.CToolsAutoSubmit = {
+ attach: function(context) {
+ // 'this' references the form element
+ function triggerSubmit (e) {
+ var $this = $(this);
+ if (!$this.hasClass('ctools-ajaxing')) {
+ $this.find('.ctools-auto-submit-click').click();
+ }
+ }
+
+ // the change event bubbles so we only need to bind it to the outer form
+ $('form.ctools-auto-submit-full-form', context)
+ .add('.ctools-auto-submit', context)
+ .filter('form, select, input:not(:text, :submit)')
+ .once('ctools-auto-submit')
+ .change(function (e) {
+ // don't trigger on text change for full-form
+ if ($(e.target).is(':not(:text, :submit, .ctools-auto-submit-exclude)')) {
+ triggerSubmit.call(e.target.form);
+ }
+ });
+
+ // e.keyCode: key
+ var discardKeyCode = [
+ 16, // shift
+ 17, // ctrl
+ 18, // alt
+ 20, // caps lock
+ 33, // page up
+ 34, // page down
+ 35, // end
+ 36, // home
+ 37, // left arrow
+ 38, // up arrow
+ 39, // right arrow
+ 40, // down arrow
+ 9, // tab
+ 13, // enter
+ 27 // esc
+ ];
+ // Don't wait for change event on textfields
+ $('.ctools-auto-submit-full-form input:text, input:text.ctools-auto-submit', context)
+ .filter(':not(.ctools-auto-submit-exclude)')
+ .once('ctools-auto-submit', function () {
+ // each textinput element has his own timeout
+ var timeoutID = 0;
+ $(this)
+ .bind('keydown keyup', function (e) {
+ if ($.inArray(e.keyCode, discardKeyCode) === -1) {
+ timeoutID && clearTimeout(timeoutID);
+ }
+ })
+ .keyup(function(e) {
+ if ($.inArray(e.keyCode, discardKeyCode) === -1) {
+ timeoutID = setTimeout($.proxy(triggerSubmit, this.form), 500);
+ }
+ })
+ .bind('change', function (e) {
+ if ($.inArray(e.keyCode, discardKeyCode) === -1) {
+ timeoutID = setTimeout($.proxy(triggerSubmit, this.form), 500);
+ }
+ });
+ });
+ }
+}
+})(jQuery);