セマンティックUiオートコンプリート

Question

おはよう私はこのjsonデータを使ってセマンティックUIのオートコンプリートを使いたいと思います。どんなアイデアもどうぞ。以下は私が別のサイトで見たコードです。

record.json

{ 
records: [ 
     { 
     idno: "PH00019404-1", 
     firstname: "CHERRY MAE" 
     }, 
     { 
     idno: "PH00008381-2", 
     firstname: "LUZMIN" 
     } 
] 
} 

マイHtmlの

<div class="ui search focus"> 
    <div class="ui search icon input"> 
     <input class="ui search" type="text" placeholder="Colors..." autocomplete="off"> 
     <i class="search icon"></i> 
    </div> 
    <div class="results"></div> 
</div> 

私のJavascriptの

<script type="text/javascript"> 
$(document).ready(function() { 
    $('.ui.search').search({ 
    apiSettings: { 
     url: 'www.mysite.com/record.json', 
     minCharacters : 3, 
     onResponse: function(results) {  
      var response = { 
       results : [] 
      };  
      $.each(results, function(index, item) {    
       response.results.push({ 
        title  : item.idno, 
        description : item.firstname 
        //url  : item.html_url 
       }); 
      });  
      return response; 
     }, 
    }, 
    }); 
}); 
</script> 

Answer 1

私は、このリンクへの答えを得ました。 https://semantic-ui.com/modules/search.html#/examples

<script> 
$('.ui.search') 
    .search({ 
    apiSettings: { 
    url: 'http://localhost/views/api/members?q={query}' 
    }, 
    fields: { 
    results : 'records', 
    description : 'name', 
    title : 'idno' 
}, 
minCharacters : 3 
}) 
; 
</script>