jquery-chosen 下拉列表應該在頂部獲得匹配的搜索結果

Question

我有 jquery 選擇的下拉菜單，可以很好地滿足我的需要。 我唯一的要求是我們可以在頂部獲得匹配的搜索結果（以搜索鍵開頭的選項）。

如果我有 3 個選項Foo , Boo , ooo然后搜索oo 。 按字母順序獲取結果，如Boo 、 Foo 、 ooo 。 但是，我們能得到像ooo , Boo , Foo這樣的結果ooo ？

$('.chosen-select').chosen({
    width: "100%",
    search_contains: true
});

我不確定該插件是否對此有任何支持。 請建議。

Answer 1

您可以像下面這樣編寫自定義邏輯。 我在評論中添加了相同的小提琴。

<div id = "results"></div>


$( document ).ready(function() {
    var chosenValues = ["Foo", "Boo", "Ooo"];
    var sortedData = checkStartsWith(chosenValues, 'oo');    
        $("#results").text(sortedData)
});
function checkStartsWith(chosenValues, searchTerm) {
    var matchedData = [];
    var unMatchedData = [];
    for (var i = 0; i < chosenValues.length; i++) {
        // This condition will check if searchTerm is at the beginning of data
        if (chosenValues[i].toLowerCase().indexOf(searchTerm.toLowerCase()) == 0) {
            matchedData.push(chosenValues[i]);
        }
        else {
            unMatchedData.push(chosenValues[i]);
        }       
    }
     matchedData.sort();
     unMatchedData.sort();
     return (matchedData.concat(unMatchedData));
}