Как выполнить автоматический поиск jQuery с помощью JSON

Question

Когда страница загружается и пользователь запускает событие, JavaScript запускает запрос getJSON и получает строку JSON с сервера.Это в форме:

[{id:12,type:'car',title:'ferrari'}, {id:17,type:'bicycle',title:'ferrari'}]

Так что теперь у меня есть эта строка JSON.Теперь я немного застрял.Вот как я бы хотел, чтобы это работало:

На моей странице есть поле для ввода текста, в котором пользователь может вводить буквы, а затем javascript будет автоматически искать результаты из этой строки JSON, но только из заголовков.Не следует искать по типу или по идентификатору.Затем он должен вернуть результат в виде JSON со всеми идентификаторами и типами, которые все еще там, которые я мог бы затем передать рендереру, который отображает результаты как элементы li внутри элемента ul, который находится внутри элемента div.

Часть I 'у меня возникли проблемы с актуальной поисковой частью.Если я получу правильные результаты поиска, я знаю, как их отобразить.

Я изучил плагины автозаполнения, но не могу заставить их работать так, как мне хочется, и они на самом деле не предназначены для таких вещей, как я.предполагать.Я предпочел бы большинство плагинов, которые, как известно, безопасны и без ошибок в использовании.Если вы говорите, что для этого нет подходящего плагина, тогда, я думаю, я бы сделал это сам.Я просто хочу знать, прежде чем снова начать изобретать колесо.

Причина поиска на стороне клиента состоит в том, что я думаю, что это будет меньше стресса для сервера.Причина в том, что он начинается со всех показанных результатов, и так как результаты уже получены, я не хочу запрашивать некоторые результаты снова.Причина, по которой он выбирается с помощью ajax, заключается в том, что он не будет выбран, если пользователь не выполнит определенное событие, которое будет нажатием кнопки.

PS: Если у вас есть предложения, как сделать это наиболее эффективным способом, почувствуйтебесплатно обучать меня :)

Answer 1

Вам придется пройтись по массиву и сопоставить заголовок с поисковым запросом. Вы можете сопоставить это с помощью substr () или indexOf () или создать что-то с помощью Regex. Просто верните спички.

маленький пример кода:

function AutoComplete(searchquery, data){ 
  var j = 0; var returns = []; 
  for(i in data){ 
    if(data[i].title.indexOf(searchquery) > -1){ returns[j++] = data[i]; } } 
  return returns;
}

Это должно помочь вам начать, верно?

PS: извините, я не знал, как отформатировать код выше.

Answer 2

function searchFromData(searchquery,data) {
var returns = [];
$.each(data,function(){
    if(this.title.indexOf(searchquery) > -1){
        returns.push(this);
    }
});
return returns;
}

Я использовал эту функцию, которая похожа на сообщение от daan.