どのように情報

Question

を追加するのAjaxとjQueryを使用する私はそれが

<script type="text/javascript"> 
     $.ajax({ 
       url: 'obtenerPaises', 
       type: 'get', 
       success: function (data) { 
        console.log(data); 
       } 
     }); 
    </script> 

正常に動作するものをjQueryを使って、このコードを持っている。しかし、私はjqueryの-UIのオートコンプリートのプラグインを使用する必要があり、どのように私は私が受け取る情報を追加することができます次のコードのデータに？

<script> 
    $(function() { 
    var availableTags = [ 
     "ActionScript", 
     "AppleScript", 
     "Asp", 
     "BASIC", 
     "C", 
     "C++", 
     "Clojure", 
     "COBOL", 
     "ColdFusion", 
     "Erlang", 
     "Fortran", 
     "Groovy", 
     "Haskell", 
     "Java", 
     "JavaScript", 
     "Lisp", 
     "Perl", 
     "PHP", 
     "Python", 
     "Ruby", 
     "Scala", 
     "Scheme" 
    ]; 
    $("#tags").autocomplete({ 
     source: availableTags 
    }); 
    }); 
    </script> 

Answer 1

これには、jQuery-UI機能を使用する必要があります。あなたはここで多くを読むことができます：http://api.jqueryui.com/autocomplete/

$("#tags").autocomplete({ 
    source: function (request, response) { 
     $.getJSON('obtenerPaises', {}, response); 
    }, 
    minLenght: 0, 
    select: function (event, ui) { 
     //here comes what happens if a user selected an item 
    }, 
    response: function (event, ui) { 
     //when server response 
    }, 
    close: function (event, ui) { 
     //It is trigger when the menu is closed 
    } 
}); 

Answer 2

jQuery UI Autocomplete docsによると、データソースとしてGET AJAXリクエストを使用することができます。 JSONPは、データオブジェクト（この場合は配列）をサーバーからウィジェットが使用するリストに変換する、ドメイン間で安全なGET固有の要求タイプです。したがって、次のようになります：

$("#tags").autocomplete({ 
    source: function(request, response) { 
     $.ajax({ 
      url: 'obtenerPaises', 
      dataType: 'jsonp', 
      success: function (data) { 
       console.log(data); 
      } 
    }); 
    } 
});