JQuery Автозаполнение KEYUP против KEYPRESS против KEYDOWN

Question

У меня большой набор данных, около 300 000 записей, и, кроме того, я очень мало могу добавить к запросу, чтобы сократить его ДРУГОЕ, чем то, что введено в поле поиска.

Разница вkeyup vs keydown не заметен на массиве из 10 фруктов или нескольких сотен стран, но его ОГРОМНО при работе с 300 000+ записей, и вам нужно это первое нажатие клавиши, чтобы отбросить некоторые варианты выбора.

Для иллюстрации

// on FIRST keydown field value is blank as expected, 
// (value is present on keyup)

$('#autoCompleteField').keypress(function(){
  var formVal=$('#autoCompleteField').val();
});

// assume ive made it safely to my php form
// $formVal = jquery value shown above
// translates to query below

select('id','name') from myTable where name like '%%'

Было бы неплохо составить список из 10 фруктов или пары сотен стран, как это происходит на их демонстрациях без последствий, но для ничего не подозревающего человека с более чем 300 000 записей это кажется довольно большимнедосмотр.

Есть ли причина, по которой вы НЕ ДОЛЖНЫ использовать keyup?

Answer 1

Я создал свою собственную задачу автозаполнения, которая работает для 300 000+ записей на скорости деформации. Ключ должен был возвращать только ограниченное количество записей с каждым нажатием клавиши, в моем случае я использовал 10. Вот мой красноречивый запрос.

$ first3 & $ last3 - мои собственные переменные, вставьте свою собственную логику.

     $queries=largeData::select('FirstName','LastName')
     ->where('FirstName','like','%'.$first3.'%')
     ->where('LastName','like','%'.$last3.'%')
     ->take(10)
     ->get();

Это НЕ работает с плагинами jquery, которые я пробовал. Он будет доставлять первые 10 алфавитных записей, независимо от моего поискового запроса, и при втором нажатии клавиши он будет использовать только те 10, которые выбраны в качестве пула поиска, что приведет к отсутствию записей.

Для jQuery

$('#myAutoSearchBox').keyup(function(){

  var formVal=$('#myAutoSearchBox').val();
  var formVal=formVal.trim();
  var theURL='/getMyRecord'+formVal;

  if(formVal){
     ajaxGet_myAutoComplete(theURL);
     $('.rosterResults').show();
  }else{
     $('.rosterResults').hide();
  }

});

И, наконец, функция успеха ajax отправляет мой html в мой список rosterResults.

function ajaxGet_myAutoComplete(theURL){
   $.ajax({
     url: theURL,
     type: "GET",
     dataType: "html",

     success: function(response){
        $(".rosterResults").html(response);
     }
  });
}

Это может показаться очень простым для тех, кто знает клочок jquery и ajax, но для тех, кто этого не знает, это было решение, которое я не нашел нигде, который помог бы мне.