2

I have a view with exposed filters using AJAX and auto-submit feature.

The problem is it reacts too fast, submitting the request after every key up very fast, so that the view is reloaded before users could finish to type search text...

I would like instead to choose how many millisec it waits before sending request...

  • Instead of this roundabout method, have you tried changing the input type for the element that the users are typing into? It sounds like you're using an auto-complete widget when you should set it to plain text. Is this the case? – Deryck Jul 4 '14 at 16:57
  • @Deryck thanks and sorry for late reply I was out.. But I don't see where I could set it to basic input vs auto complete ? I need "OPERATOR CONTAINS ALL VALUES" for searching, and I'm in a view setup, not in a edit node form one. – Kojo Jul 7 '14 at 17:25
3

I tried different ways to do that, this working one was suggested by Andy in comments to a close but different issue, thanks to him !

In fact CTools autosubmit has a hardcoded delay on submitting fixed to 500ms.

A possible way is to switch auto-submit.js to your own modified copy. However if you do this, you'll need to check if auto-submit.js has changed every time you do an upgrade to CTools. :

function neptune_js_alter(&$javascript) {
  if ($some_condition) {
    $new_autosubmit = drupal_get_path('theme', 'YOUR_THEME') . '/js/auto-submit.js';
    $javascript['profiles/commons/modules/contrib/ctools/js/auto-submit.js'] = drupal_js_defaults($new_autosubmit);
  }
}

And set your value into auto-submit.js :

//Lines 87 and following
    var timer = 3000;
          .keyup(function(e) {
            if ($.inArray(e.keyCode, discardKeyCode) === -1) {
              timeoutID = setTimeout($.proxy(triggerSubmit, this.form), timer);
            }
          })
          .bind('change', function (e) {
            if ($.inArray(e.keyCode, discardKeyCode) === -1) {
              timeoutID = setTimeout($.proxy(triggerSubmit, this.form), timer);
            }
          });

To be more flexible you may want to add an attribute to the input you need to change :

function MODULE_form_MYFORM_alter(&$form, &$form_state, $form_id) {
  $form['MY_INPUT']['#attributes'] = array('class' => array('ctools-auto-submit-delayed'));
}

And then change value for this class only

    var timeoutID = 0;
    var timer = 500;
    if ($(this).hasClass('ctools-auto-submit-delayed')) {
      timer = 3000;
    }
    $(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), timer);
        }
      })
      .bind('change', function (e) {
        if ($.inArray(e.keyCode, discardKeyCode) === -1) {
          timeoutID = setTimeout($.proxy(triggerSubmit, this.form), timer);
        }
      });

This would be more elegant & flexible to pass directly the timer value to js, but I have no time to think more about it.

PS : there is an existing patch about that issue but it returns errors in my config.

  • @andy, why should we check if auto-submit.js has changed every time you do an upgrade to CTools? I thought that drupal_js_defaults($new_autosubmit) would replace the original one in any case ? you mean for the hardcoded path I guess ? – Kojo Jul 18 '14 at 15:11
  • 1
    Sorry for the delay. It does replace the original one, which can be a problem. Worst case scenario, a horrible security bug is found in auto-submit.js, CTools is updated, you update CTools on your site, and the custom code above dutifully ensures that the new secure auto-submit.js is replaced with an old insecure version! Instead of a security fix it could be a new feature (eg. if that patch ever gets committed), or simply an implementation change. If there is a new version, you can just copy and modify it as before. I'd keep track of it in the same place you record applied patches. – Andy Jul 21 '14 at 11:15
  • 1
    I was able to use your code snippet by copying over the Drupal.behaviors.CToolsAutoSubmit function into my theme's javascript then making my changes there. Thanks! – Japo Domingo Sep 28 '18 at 0:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.