将新结果附加到打开的 jQuery 自动完成菜单

Question

我有一个应用程序，其中有多个搜索源。以前，用户必须在搜索之前选择要搜索的来源。如果他们没有选择，应用程序将默认使用其中一个选项。

但是，现在他们想同时搜索所有来源。这已经足够好了，但问题是当其中一个搜索返回时，它会覆盖之前的搜索结果。几乎是预期的行为。我基本上想要的是将新结果附加到已经打开的自动完成菜单中，而不是覆盖旧结果。自然，自动完成菜单在关闭时必须清空。

我想这是可能的，但什么方法是最好的？我猜我可能只有一个数组，我将结果附加到该数组，然后覆盖 _renderMenu 以使用该数组而不是传递给函数的项。然后在关闭事件中清空所述数组。

这是最好的方法吗？还是有更优雅的解决方案？

一些代码： 好的，所以 searchAction 最终被 jquery 自动完成调用。在collection.search 我做ajax 调用，这里的URL 基于this 参数创建，然后调用respondWhithData 并将搜索结果映射到适当的格式（即自动完成菜单的值和标签）。从 respondWithData 调用响应后，jquery 会自动呈现结果菜单。因此，我可能必须覆盖响应事件函数以及 _renderMenu 和可能的 _renderItem，是吗？

searchAction: function(searchTerm, collection, response){
    var self = this;
    $.when(collection.search(searchTerm, this)).then(function(data) {
        self.respondWithData(data, response);
    });
},
respondWithData : function(data, response) {
    if (data.length > 0) {
        var responseVal = _.map(data, this.mapData);
        this.checkResponseCount(responseVal);
        response(responseVal);
    }
    else {
        response(this.emptyResult());
    }
},

需要明确的是，问题不在于多重搜索本身，而是呈现异步结果。我想渲染第一个返回的结果，然后在它们从服务器返回后立即附加其余的结果。

编辑 2： 刚刚尝试在 autocompleteresponse 事件中编辑 ui.content ，但由于某种原因，一旦呈现，任何编辑都不会进行......

编辑3：啊，ui.content只能直接修改，不能改。如果我推送每一个更改而不是连接两个数组 ui.content 显示我想要的。 我猜它有效，但并不完美。

Answer 1

我能猜出你的场景看起来如何，但我猜：

你应该喜欢：

function search1() {
   $.ajax({ ...
      success: function(data) {
         $('#myResultsDiv").html(data)
      }
   });    
}

等

您需要附加以下结果，而不是覆盖 #myResultsDiv：

function search1() {
   $.ajax({ ...
      success: function(data) {
         $('#myResultsDiv").append(data)
      }
   });    
}

编辑：你也可以这样做：

var resultsArray = []; var searchDone = 0; var totalSearchs = 5; //假设5次搜索

函数 search1() {

function search1() {
   $.ajax({ ...
      success: function(data) {
         //APPEND data to resultsArray
         searchDone++;
         if(searchDone==totalSearch) //syncronize the 5 searchs before render
            renderSearchs(resultsArray);

      }
   });    
}