Question

考虑用户必须从数千个值列表中选择多个值的情况。我最接近可用工具的是http://quasipartikel.at/multiselect/

主要问题是由于用户必须选择的大量数据。我目前使用的方法是用户必须在文本框中输入第一个字符，然后显示所有以第一个字符开头的值以进行多次选择。（从而过滤到相当大的值列表）

问题在于，即使这样，值的数量也很大，重新加载多选选项需要5-15秒。但是一旦加载了值，当用户输入成功的字符时，javascript过滤将处理其余的值。

关于解决这种情况的任何其他方式的任何建议????

Answer 1

不使用预先填充的多选框，而是使用jQueryUI Autocomplete过滤列表服务器端并仅返回与客户端的匹配（类似于标签选择在StackOverflow上的工作方式）。

这里有一个很好的选择多个值的例子http://jqueryui.com/autocomplete/#multiple-remote

然后，您可以按照处理多选的方式保存选择结果。

要实现混合方法，其中第一个字母从服务器获取术语，然后从这些结果中过滤，您可以使用以下内容（请注意，这是完全未经测试的）：

添加全局变量以保存结果

var results_cache = [];

在autocomplete

中使用混合来源

source: function( request, response ) {
    // get the first letter of your search term
    var letter = request.term.substring(0,1);
    // check to see if we already have results for this letter
    if (!results_cache[letter]){
        // no results, fetch via AJAX
        $.getJSON( "search.php", { term: request.term }, 
            function(data){ 
                // cache results
                results_cache[letter] = data;
                // filter results (in case we have more than just 1 character in the term)
                response($.ui.autocomplete.filter(data, request.term));
            }
        );
    } else {
        // we already have data for this letter, just filter the results from the cache
        response($.ui.autocomplete.filter(results_cache[letter], request.term));
    }
},
search: function() {
    // make sure we have at least 1 character for the term
    if (!this.value) return;
    var term = this.value;
},

Answer 2

以下内容非常有用：

首先，在选择最终的大尺寸输入之前，根据某些输入参数过滤值。 其次，在加载jquery选择值之前将限制从一个字符增加到多个。这将进一步限制值的数量，但用户必须知道多字符输入限制

但是http://quasipartikel.at/multiselect/仍然是最好的选择。

Jquery Multi-Select适用于大量选项

2 个答案: