jQuery自動完成以找到完全匹配

-1

我有一個機場的jQuery自動完成。我的數據集包含標籤和值。樣品：jQuery自動完成以找到完全匹配

var Airports = [ 
    { "label": "DMB - Dzhambyl, Dzhambyl Airport", "value": "DMB" }, 
    { "label": "EMA - Nottingham, Nottingham East Midlands Airport", "value": "EMA" }, 
    { "label": "HAM - Hamburg, Hamburg Airport", "value": "HAM" }  
];

當我進入HAM（這是3LC漢堡機場）目前，我得到所有這三個項目的結果。但是，如果此商品的價值與確切的搜索請求相匹配，我只想看到「漢堡 - 漢堡機場」。應該也可以找到所有的條目，例如「burg」在裏面，如果我要搜索的話。

演示：https://jsfiddle.net/SchweizerSchoggi/pguoa197/1/

來源

2016-07-01 SchweizerSchoggi

在jQuery的自動完成API文檔http://api.jqueryui.com/自動完成/有一個示例顯示如何從文本的開頭進行匹配。 –

是的，但兩者都應該是可能的。如果我使用「從文本開始搜索」比我會發現漢堡漢堡，但沒有在文本中間的「伯格」的條目，如果我要搜索該 – SchweizerSchoggi

所以，你想匹配的值，如果它是一個確切的命中，否則在文字上匹配？在這種情況下，修改源函數以提供該行爲。 –

不知道是誰下投這個問題，爲什麼...但這裏是解決方案誰以往任何時候都需要在今後類似的事情：

$(function() { 
    var Airports = [ 
     { "label": "DMB - Dzhambyl, Dzhambyl Airport", "value": "DMB" }, 
     { "label": "EMA - Nottingham, Nottingham East Midlands Airport", "value": "EMA" }, 
     { "label": "HAM - Hamburg, Hamburg Airport", "value": "HAM" }  
    ]; 


$("#depart").autocomplete({ 
    source: function (request, response) { 
     var term = $.ui.autocomplete.escapeRegex(request.term) 
      , startsWithMatcher = new RegExp("^" + term, "i") 
      , startsWith = $.grep(Airports, function(value) { 
       return startsWithMatcher.test(value.label || value.value || value); 
      }) 
      , containsMatcher = new RegExp(term, "i") 
      , contains = $.grep(Airports, function (value) { 
       return $.inArray(value, startsWith) < 0 && 
        containsMatcher.test(value.label || value.value || value); 
      }); 

      response(startsWith.concat(contains)); 
    }, 
    minLength: 3 
    }); 
});

工作示例：https://jsfiddle.net/SchweizerSchoggi/pguoa197/5/

來源

2016-07-04 09:03:00 SchweizerSchoggi

我不明白這是一個修復程序，因爲它顯示與問題中的代碼完全相同的結果。如果您只想將列表中的「HAM」向上移動，您可以指定自定義排序。 –

這不一樣。當你進入HAM時，漢堡現在首先出現（匹配3LC），然後是其餘的。在最初的樣本中，漢堡僅在pos 3上 – SchweizerSchoggi

在這種情況下，您只需要實施自定義排序。您的問題意味着您只想過濾第一個字符 - 「但是如果此商品的價值與確切的搜索請求匹配，我只想看到」漢堡 - 漢堡機場「 –

從您的問題描述，這聽起來像你只想從值字符串的開頭相匹配。在這種情況下你可以創建自己的過濾方法爲自動完成，像這樣：

$.ui.autocomplete.filter = function (array, term) { 
    var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex(term), "i"); 
    return $.grep(array, function (value) { 
     return matcher.test(value.label || value.value || value); 
    }); 
};

Updated fiddle

來源

2016-07-01 16:24:41

Thx Rory，漢堡（火腿）這工作正常但它也應該可以找到，例如「諾丁漢」，現在不再是這種情況了 – SchweizerSchoggi

恐怕是一個或另一個，'ham'是兩個字符串的有效部分，因此在搜索時會顯示。 –

它現在可以工作，看到我的答案上面:-) – SchweizerSchoggi

jQuery自動完成以找到完全匹配

回答

相關問題