Всегда показывать список автозаполнения, даже если поиск не соответствует
У меня есть поле автозаполнения, и по типу я перехожу к PHP / базе данных, чтобы получить соответствующие параметры.
Дело в том, что мой список предложений не совсем соответствует тексту. Я объясняю:
Скажем, я набираю «Джон». Мой список будет извлекать из базы данных «Джон Доу», «Джонатан» и т. д. В качестве предложения для ввода будет отображаться только «Джонатан», но мне они все нужны, потому что он учитывает приближение (на моем бэкэнд-поиск).
Мой код JavaScript / Ajax:
function prePatientsList(){
//I'm limiting search so it only starts on the second character
if (document.getElementById("name").value.length >= 2) {
try
{
listExecute.abort();
}catch(err) {
null;
}
var nome= $("#name").val();
var nomeList = "";
listExecute = $.ajax({
url: '/web/aconselhamento/Atendimento/PrePacientesAutocomplete',
type: "POST",
async: true,
datatype: 'json',
data: { nome: nome}
}).done(function(data){
source = JSON.parse(data);
});
$(function() {
$("input#nome").autocomplete({
source: source,
// I know I probably don't need this, but I have a similar component which has an URL as value, so when I select an option, it redirects me, and I'll apply you kind answer on both.
select: function( event, ui ) {
ui.item.label;
}
});
});
}
}Спасибо.
Не видя вашего внутреннего кода, трудно сказать наверняка, но я предполагаю, что вам нужно исследовать лучшую реализацию текстового поиска. Например, без расстояния Левенштейна или n-граммовой индексации вам может быть трудно найти близкие совпадения. Возможно, стоит попробовать Elasticsearch или Apache Solr?
Мой бэкэнд уже дает мне правильный JSON. Если я наберу Джон, моя переменная списка предложений (в данном случае источник) получит правильные значения (Джон Доу и т. д.). Проблема в том, что при автозаполнении ввода текста отображаются только элементы списка с точным соответствием. Мой список соответствует моему soundex, поэтому мне нужно, чтобы весь список отображался все время.
@ryuzakixd, пожалуйста, предоставьте пример возвращаемых данных JSON. Поскольку вы фильтруете Источник локально из возвращенных данных, это очень просто. Если термин Jon, он не попадет в John. Для этого вам нужно будет создать свой собственный алгоритм.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Я думаю, вам придется установить удаленную конечную точку напрямую как источник автозаполнения (например, аналогично https://jqueryui.com/autocomplete/#remote), чтобы бэкэнд выполнял всю фильтрацию. Прямо сейчас автозаполнение фактически думает, что вы передали ему список параметров статический, из которых должна происходить дальнейшая фильтрация, и поэтому он решает обработать фильтрацию самостоятельно.
Ваш код может быть таким же простым, как этот, я думаю, нет необходимости иметь отдельный обработчик или запрос ajax, выходящий за рамки автозаполнения.
$(function() {
$("input#nome").autocomplete({
minLength: 2, //limit to only firing when 2 characters or more are typed
source: function(request, response)
{
$.ajax({
url: '/web/aconselhamento/Atendimento/PrePacientesAutocomplete',
type: "POST",
dataType: 'json',
data: { nome: request.term } //request.term represents the value typed by the user, as detected by the autocomplete plugin
}).done(function(data){
response(data); //return the data to the autocomplete as the final list of suggestions
});
},
// I know I probably don't need this, but I have a similar component which has an URL as value, so when I select an option, it redirects me, and I'll apply you kind answer on both.
select: function( event, ui ) {
ui.item.label;
}
});
});
См. http://api.jqueryui.com/autocomplete/#option-source для получения дополнительной информации.
Большое спасибо! Мне очень жаль, что я запоздал с ответом. Я не мог проверить это сразу, потому что на время потерял доступ к своей среде. Единственное изменение, которое мне нужно было сделать, это: response (JSON.parse (data));
@ryuzakixd, вам не нужно этого делать - я просто допустил опечатку. datatype: "json" должен быть dataType: "json" - а затем jQuery позаботится о синтаксическом анализе за вас. Тогда вам не потребуется дополнительный вызов JSON.parse. Я обновил ответ, чтобы исправить опечатку.
Мое единственное предложение - использовать регулярные выражения. developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/… По-прежнему нужно будет проделать много работы, чтобы разбить строку и т. д. Удачи :)