Jquery 在 asp.net 中标记它

Jquery Tag it in asp.net

我正在使用 jQuery UI 小部件 Tag it。我正在使用的代码工作正常,但所有 Tag 值都在浏览器上可见。

我使用的代码在下面

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>
      <script src="../JavaScript/tag-it.js"></script>
    <link href="../CSS/tagit.ui-zendesk.css" rel="stylesheet" />
    <link href="../CSS/jquery.tagit.css" rel="stylesheet" />
    <script>
        $(function(){
           var sampleTags = [<%# this.SuggestionList %>];
            //var sampleTags = ['c++', 'java', 'php', 'coldfusion', 'javascript', 'asp', 'ruby', 'python', 'c', 'scala', 'groovy', 'haskell', 'perl', 'erlang', 'apl', 'cobol', 'go', 'lua'];
            $('#myTags').tagit();         
            $('#singleFieldTags').tagit({
                availableTags: sampleTags,            
                allowSpaces: true,
                singleFieldNode: $('#mySingleField')
            });
           });
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div id="content">
            <p>              
                <input name="tags" id="mySingleField" value="Apple, Orange" disabled="true">
            </p>
            <ul id="singleFieldTags"></ul>
    </div> 
    </form>
</body>

代码隐藏

string queryString = "select * from SIB_KWD_Library ORDER BY Keyword asc";

    using (SqlConnection connection = new SqlConnection(ConfigurationManager.AppSettings["vConnString"].ToString()))
    {

        using (SqlCommand command = new SqlCommand(queryString, connection))
        {

            connection.Open();

            using (SqlDataReader reader = command.ExecuteReader())
            {

                while (reader.Read())
                {

                    if (string.IsNullOrEmpty(SuggestionList))
                    {
                        SuggestionList += "\'" + reader["Keyword"].ToString() + "\'";
                    }
                    else
                    {
                        SuggestionList += ", \'" + reader["Keyword"].ToString() + "\'";
                    }

                }
            }
        }
    }

在浏览器源代码中,所有标签关键字都是可见的。像

var sampleTags = ['c++', 'java', 'php', 'coldfusion', 'javascript', 'asp', 'ruby', 'python', 'c', 'scala', 'groovy', 'haskell', 'perl', 'erlang', 'apl', 'cobol', 'go', 'lua'];

请建议任何其他方法。

提前致谢:)

使用<%= this.SuggestionList %>代替<%# this.SuggestionList %>

JS:-

 <script>
        $(function(){
           var sampleTags = [<%= this.SuggestionList %>];
            //var sampleTags = ['c++', 'java', 'php', 'coldfusion', 'javascript', 'asp', 'ruby', 'python', 'c', 'scala', 'groovy', 'haskell', 'perl', 'erlang', 'apl', 'cobol', 'go', 'lua'];
            $('#myTags').tagit();         
            $('#singleFieldTags').tagit({
                availableTags: sampleTags,            
                allowSpaces: true,
                singleFieldNode: $('#mySingleField')
            });
           });
    </script>

编辑

JS:-

<script>
    $(function () {
        $.ajax({
            url: "http://"+location.host + '/Default.aspx/GetKeywords',
            type: 'GET',
            datatype: "json",
            contentType: "application/json; charset=utf-8",
            success: function(res) {
                $('#singleFieldTags').tagit({
                    availableTags: res.d,
                    allowSpaces: true,
                    singleFieldNode: $('#mySingleField')
                });
            },
            failure: function(err) {
                alert(err);
            }
        });
    });

</script>

CS:-

    [WebMethod]
    [ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json)]
    public static string[] GetKeywords()
    {
        List<string> lst = new List<string>();
        string queryString = "select * from SIB_KWD_Library ORDER BY Keyword asc";
        using (SqlConnection connection = new SqlConnection(ConfigurationManager.AppSettings["vConnString"].ToString()))
        {
            using (SqlCommand command = new SqlCommand(queryString, connection))
            {
                connection.Open();
                using (SqlDataReader reader = command.ExecuteReader())
                {

                    while (reader.Read())
                    {
                        lst.Add(reader["Keyword"].ToString());
                    }
                }
            }
        }
        return lst.ToArray();
    }

只需将 lst 替换为您从数据库返回的关键字。