dynatable - 将可动态搜索绑定到 onchange

Question

我使用http://www.dynatable.com/并且有一个用于过滤数据的搜索输入。问题是它适用于输入/失去焦点等，我想在每个字母更改时使用它。

Answer 1

您可以更改 dynatable 以适应您的需求。在 jquery.dynatable.js（版本 0.3.1）的第 1215 行，搜索是在输入键时执行的。您可以将其更改为 keyup 而无需等待 enter 按键。默认代码：

        $search
        .bind(settings.inputs.queryEvent, function() {
          obj.queries.runSearch($(this).val());
        })
        .bind('keyup', function(e) {
          if (e.which == 13) {
            obj.queries.runSearch($(this).val());
            e.preventDefault();
          }
        });

修改后的代码：

        $search
        .bind(settings.inputs.queryEvent, function() {
          obj.queries.runSearch($(this).val());
        })
        .bind('keyup', function(e) {
          obj.queries.runSearch($(this).val());
          e.preventDefault();
        });

Answer 2

对 jquery.dynatable.js 代码的以下更改将执行您想要的操作，并且如果您正在使用“x”清除搜索输入框，也会更新结果。clear 也可以工作的原因是使用的事件是“input”而不是“keyup”或“change”，原因在文档中有详细说明。

与输入事件不同，更改事件不一定会针对元素值的每次更改而触发。

原始代码

$search
  .bind(settings.inputs.queryEvent, function() {
    obj.queries.runSearch($(this).val());
  })
  .bind('kepress', function(e) {
    if (e.which == 13) {
      obj.queries.runSearch($(this).val());
      e.preventDefault();
    }
  });

修改后的代码

$search
  .bind(settings.inputs.queryEvent, function() {
    obj.queries.runSearch($(this).val());
  })
  .bind('input', function(e) {
    obj.queries.runSearch($(this).val());
    e.preventDefault();
  });

注意：基于 nexuscreator 的回答。非常好的答案，帮助很大，谢谢。

Answer 3

为我工作:)

$search
    .bind(settings.inputs.queryEvent, function() {
      obj.queries.runSearch($(this).val());
    })
    .bind('keyup', function(e) {
      obj.queries.runSearch($(this).val());
      e.preventDefault();
    });