使用文本框过滤和搜索

Question

此问题是

的后续问题

我正在添加一个额外的功能，为此我想使用文本框过滤值。这是过滤器的代码

var filterAndLimitResults = function (cursor) {

if (!cursor) {
    return [];
}

var raw = cursor.fetch();
var currentSearchTitle = searchTitle.get();

if(!(!currentSearchTitle || currentSearchTitle == "")) {
      filtered = _.filter(filtered, function (item) {
              return item.title === currentSearchTitle ;
              console.log(item.title === currentSearchTitle);
      });
    }
var currentLimit =limit.get();
//enforce the limit
if (currentLimit ) {
    filtered = _.first(filtered, currentLimit );
}
return filtered;
};

这是我在搜索文本框上进行的 keyup 事件

"keyup #search-title":function(e,t){
     if(e.which === 27){
       searchTitle.set("");
     }
     else {
       var text = $(e.target.val);
       searchTitle.set(text)
       console.log(searchTitle.set(text));
     }
   }

有了这个，我可以 return 在 console 中的每个按键上收集所有对象，但它不会过滤列表中的值，它会消失 [=24] 中的所有列表=].请帮忙

Answer 1

你几乎是对的。您的 keyUp 事件没问题，但您也可以避免像这样使用 jQuery：

"keyup .textInput": function(e, t) {
    var searchString = e.currentTarget.value;
    switch (e.which) {
        case 27:
        e.currentTarget.value = "";
        searchTitle.set("");
        break;
        default:
        searchTitle.set(searchString);
    }
}

请注意，我使用了一个开关，以防您想为特定搜索添加快捷方式，例如 cmd+maj+c 仅搜索城市（这可能有点矫枉过正）

关于搜索功能，我假设您想在当前的下拉列表过滤范围内搜索项目的标题。然后您需要添加一个额外的步骤来执行此操作。您还需要在其他过滤器之前设置它。请参阅下面的示例，将其插入 var filtered = [];:

之后

var filtered = [];
var currentSearchTitle = searchTitle.get();
if(!currentSearchTitle || currentSearchTitle == "") {
    filtered = raw;
} else {
    currentSearchTitle = currentSearchTitle .replace(".", "\.");//for regex
    var regEx = new RegExp(currentSearchTitle , "i");

    filtered = _.filter(raw, function(item) {
        return (item && item.title && item.title.match(regEx));
    });
}
// your other filtering tasks
return filtered;

此外，请花时间了解代码的作用，切勿只是复制粘贴。

此代码受到 meteorkitchen author, @Perak 的强烈启发。我改编了它，但我还没有测试它“as-is”。

使用文本框过滤和搜索

Filter and search using Textbox

meteor

meteor-helper