The current default timeouts of 500 ms (.5 seconds) are not suitable for all fields or use-cases. Site owners may want to allow for longer timeouts, especially for text fields, where a user may have a second or more between keystrokes.

Additionally, there are issues (such as #1069966: Blocks exposed filters have wrong url in form action) with views exposed filters where pressing the enter key will submit the form to an incorrect URL specified in the form's action tag (particularly on block views with exposed filters). Allowing the auto-submit.js script to capture these ENTER keystrokes and ignore them will prevent that error from occurring (at least when JavaScript is enabled).

This patch allow users to set different timeouts for text fields and all other types, as well as optionally ignore ENTER keypresses.

Due to how the javascript is included by Drupal, modules wishing to take advantage of will need to tweak how they attach the auto-submit.js file and add a setting variable that can be passed through to the javascript. This has already been done to the needed CTools Page Manager filter.

A simple change to the Views module will allow it to work properly with Views Exposed Filters. Use the #6 Patch against the Dev version of Views, or in .../views/plugins/views_plugin_exposed_form.inc after this:

      $form['#attached']['js'][] = drupal_get_path('module', 'ctools') . '/js/auto-submit.js';

(around line 270) add this code to pull in the settings and pass them through to the auto-submit.js script:

      // Send auto-submit settings to javascript if supported by current version of ctools.
      if (function_exists('ctools_get_auto_submit_settings')) {
        $form['#attached']['js'][] = array('data' => ctools_get_auto_submit_settings(), 'type' => 'setting');
      }

Flush your caches and it should start working.

The patch adds a CTools settings page where the timeouts and ENTER ignoring can be configured:

Screenshot of admin options for configuring timeouts and ENTER key ignores

Comments

diamondsea created an issue. See original summary.

diamondsea’s picture

Patch against 7.x-1.x-dev.

diamondsea’s picture

Status: Active » Needs review
diamondsea’s picture

Added missing ctools.admin.inc file to patch

diamondsea’s picture

Rerolled patch against latest dev version.

diamondsea’s picture

This is the patch to be applied against Views to enable the new ctools timeout settings to be passed through. This patch will be submitted to the Views issue queue after this issue has been merged into cTools.

mmcintosh’s picture

Reviewed and tested #5 (ctools patch) and #6 (views patch) both install with no errors and work as expected I can now change the auto-submit timeout. This was done on fresh install druapl: 7.50 ctools version: 7.x-1.10+0-dev and views: 7.x-3.14+5-dev. I also ran both patches through Drupal coder and no problems were found in all 6 hunks. Thanks for the patch it will help fix some issues that we have had for a long time.

diamondsea’s picture

Issue summary: View changes
brooke_heaton’s picture

Reviewed and tested #5 (ctools patch) and #6 (views patch) against Drupal 7.50, Ctools 7.x-1.10+0-dev and Views 7.x-3.14+5-dev. Both worked for me. Great patch and upgrade to autosubmit.

brooke_heaton’s picture

Status: Needs review » Reviewed & tested by the community
japerry’s picture

Status: Reviewed & tested by the community » Needs work

Will need to be re-rolled to work with changes from #2275355: Auto submit to submit a non-existent form.

diamondsea’s picture

Rerolled against latest Dev version. NOTE: you will still also need the Views patch in #6 for it to work on exposed filters.

diamondsea’s picture

Status: Needs work » Needs review
rivimey’s picture

Issue tags: +Needs tests

We are trying to improve the test coverage... please, please include some tests that exercise this code.

xenophyle’s picture

Seems like #12 needs ctools.admin.inc, or am I missing something...

rivimey’s picture

@xenophyle I think you are quite correct... @diamondsea could you redo the patch please?

darrenwh’s picture

Status: Needs review » Needs work

A few DCS items.

  1. +++ b/js/auto-submit.js
    @@ -1,102 +1,126 @@
    +  /**
    +   * 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.
    +   */
    

    These comments go over the DCS 80 char limit in places lines 20, 21,29 and 32

  2. +++ b/js/auto-submit.js
    @@ -1,102 +1,126 @@
    +      // Get settings passed from modules
    

    Missing period at end of line.

  3. +++ b/js/auto-submit.js
    @@ -1,102 +1,126 @@
    +      // 'this' references the form element
    

    Missing period at end of line.

  4. +++ b/js/auto-submit.js
    @@ -1,102 +1,126 @@
    +      // the change event bubbles so we only need to bind it to the outer form
    

    Missing period and capital.

  5. +++ b/js/auto-submit.js
    @@ -1,102 +1,126 @@
    +            // don't trigger on text change for full-form
    

    As above

  6. +++ b/js/auto-submit.js
    @@ -1,102 +1,126 @@
    +      // Don't wait for change event on textfields
    

    As above

  7. +++ b/js/auto-submit.js
    @@ -1,102 +1,126 @@
    +                  // Discard ENTER key presses to prevent page redirect on exposed block filters
    

    Line goes over DCS 80 char limit.

  8. +++ b/page_manager/page_manager.admin.inc
    @@ -327,6 +327,7 @@ function page_manager_list_pages_form($form, &$form_state) {
    +  $form['#attached']['js'][] = array('data' => ctools_get_auto_submit_settings(), 'type' => 'setting');
    

    Look to break line so array on separate lines and does not go beyond DCS char limit

chris-adhome’s picture

Applied Patch #5 & #6 and everything is working as it should. Will report back any issues if I find them.

Thanks for your efforts diamondsea!

hotwebmatter’s picture

Assigned: Unassigned » hotwebmatter
Status: Needs work » Needs review
StatusFileSize
new13.49 KB

The hook_menu() in patch #12 needed ctools.admin.inc and the custom 'administer ctools settings' permission before it would work for me.

I found ctools.admin.inc in patch #5, and added the permission myself.

This should work better out of the box. Be sure to grant the custom 'administer ctools settings' permission to yourself, or you will not be able to access the CTools Settings at /admin/config/system/ctools.

Thanks @diamondsea!

NOTE: you will still also need the Views patch in #6 for it to work on exposed filters.

antonyanimator’s picture

Received following when applying patch:

patching file ctools.admin.inc
patching file ctools.info
Hunk #2 FAILED at 19.
1 out of 2 hunks FAILED -- saving rejects to file ctools.info.rej
patching file ctools.module
Hunk #1 succeeded at 661 (offset 3 lines).
Hunk #2 succeeded at 686 (offset 3 lines).
Hunk #3 succeeded at 1220 (offset 3 lines).
patching file js/auto-submit.js
patching file page_manager/page_manager.admin.inc

joelpittet’s picture

Status: Needs review » Needs work
Issue tags: +Needs reroll

Likely needs a reroll

rivimey’s picture

Rerolled, also removed packaging info from the .info file.

hotwebmatter’s picture

Thanks for the re-roll @rvimey -- I can confirm that it's working for me.

I added the ctools.admin.inc file, which is easy to leave out by mistake since it's a new file rather than a patch to an existing file. (People who have already applied an earlier version of the patch will be able to use the patch in #22, but people who have never applied it before will need the ctools.admin.inc file in order to configure the timeout values.)

rpayanm’s picture

Status: Needs work » Needs review
Issue tags: -Needs reroll
japerry’s picture

Status: Needs review » Closed (outdated)

Drupal 7 is no longer supported, closing.

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.