実行時にオートコンプリート検索バー

Question

私はcodeigniterでオートコンプリート検索をしようとしていますが、ユーザが入力フィールドに書き込むときにリストが最初に開かれたが、ユーザ入力に応じて変更されなかったという問題があります。それは初めて初めて発生します。ここ

私のコードです：

<script> 
$(document).ready(function(){ 
    $('#text').keyup(function() { 
    var min_length = 0; 
    var keyword = $('#text').val(); 
    if (keyword.length >= min_length) { 
     $.ajax({ 
     url: 'http://localhost/new/index.php/travels/search_fields', 
     type: 'POST', 
     dataType: 'json', 
     data: { term: $("#text").val()}, 
     success: function(data) { 
      $.each(data, function() { 
      $.each(this, function(k, v) { 
       $("#demo").append("<li>" + v + "</li>"); 
      }); 
      }); 
     } 
     }); 
    } else { 
     $('#demo').hide(); 
    } 
    }); 
}); 
</script> 

とクエリは次のとおりです。

function search_field($country_id){ 
    $this->db->distinct(); 
    $this->db->select("destination"); 
    $this->db->from('travels_detail'); 
    $this->db->like('destination', $country_id); 
    $query = $this->db->get(); 
    return $query->result(); 

Answer 1

あなたが実際にここにAJAXで最も困難な問題のいくつか、リクエストをキャンセルする、すなわち問題に触れています要求がどんな順序でも完了できるという事実。

検索フィールドに「123」と入力します。次に、 '1'、 '12'、 '123'という3つの要求を送信します。

この時点では、最初の2つのリクエストの結果にもう関心がありません。しかし、これを正しく扱うコードを書くことは難しいことがあります。もう1つの問題は、の注文がすべての注文で完了することです。たとえば、要求が逆の順序（3番目、2番目、1番目）で完了したとします。おそらく、実際に望むものではなく、第1の要求の結果のみを表示することになります。

これを処理する方法の1つは、Promisesです。そのトピックhereの素晴らしい紹介を見つけることができます。この種の問題の大きな解決策は、RxJSライブラリです。これは、とりわけ非同期コレクションをストリームとして扱うことができる優れたライブラリです。 RxJSリポジトリにもautocomplete exampleがあります。しかし、Rxは多くの機能といくつかの新しいコンセプトを備えた巨大なライブラリです。これはPromisesを最初に感じることから始めるのが最善かもしれません。