jquery cshtmlのSQL ServerクエリからUIオートコンプリートリスト

Question

このjquery UIオートコンプリートテンプレート（https://jqueryui.com/autocomplete/#default）に従っていますが、SQL Serverのdbクエリからオートコンプリート用のデータを取得しようとしています。

私はJavaScriptに到達したとき、私は私のavailableTagsを必要とするようですが、[、「ABC」、「DEF」、「GHI」... "]の形を持っているjavascript配列に見えますjqueryのであるものに基づいてUIのデモのソースコード

var availableTags = [ 
    "ActionScript", 
    "AppleScript", 
    "Asp", 
    "BASIC", 
    "..."]; 

私のコードは、現在、私にこのようなリストを取得します。。ABCは、DEF、GHI、...実は私もそれは{ABC、DEF、GHIとして表示かどうかわからないんだけど、...}または[abc、def、ghi ...]をjavascript変数に渡したとき

これは私のデータベースからリストを取得するコードです

@{ 
List<string> availableTags = new List<string>(); 
foreach (var item in db.Query("SELECT Tag FROM my_tags_table")) 
    { 
    var Tag = item.Tag ; 
    availableTags.Add(Tag); 
    string tagString = (string.Join(", ", availableTags.Select(x => x.ToString()).ToArray())); 
    } 
    } 

デバッグは、tagStringがリストabc、def、ghi、...として作成されていることを示していますが、私はそこに二重引用符を追加する必要があると述べました。ここで私はjavascript配列/変数にtagStringを渡します。

<script> 
     $(function() { 
     var availableTags = '<%=tagString%>'; 
      $("#tags").autocomplete({ 
       source: availableTags 
      }); 
     }); 
</script> 

次に入力ボックスです。

<div class="ui-widget"> 
    <input id="tags"> 
</div>  

誰かが私には1）で二重引用符を追加し、2）availableTagsに必要とされる他のものはjavascript配列正しいとして表示するか助けることができますか？

Answer 1

jQueryオートコンプリートでは、ソースプロパティ値が配列として必要です。 string.Joinメソッドは、 Item1, Item2, Item3のようにコンマで区切られた文字列値を返します。

必要なものは配列です。

@{ 
    List<string> availableTags = new List<string>(); 
    foreach (var item in db.Query("SELECT Tag FROM my_tags_table")) 
    { 
    var Tag = item.Tag ; 
    availableTags.Add(Tag);  
    } 
} 

と同じビューでのスクリプトのセクションでは、あなたはjavascript配列に、このC＃のvaribale（availableTagsリスト）に変換し、それを使用することができます。

$(function() { 

    var availableTags = @Html.Raw(Newtonsoft.Json.JsonConvert 
               .SerializeObject(availableTags.ToArray())); 
    $("#tags").autocomplete({ source: availableTags }); 
});