如何使用C#WebMethod动态填充选择 [英] How to dynamicallly populate selectize using c# webmethod

问题描述

我正在使用 https://selectize.github.io/selectize.js/ 并且我遵循了他们的动态人口示例

I am using https://selectize.github.io/selectize.js/ and I've followed their example for dynamic population

我的aspx页面中有

        $('#stationid').selectize({
        valueField: 'value',
        labelField: 'text',
        searchField: ['text'],
        create: function (input, callback) {
            $.ajax({
                url: 'Search.aspx/GetListboxValues',
                data: "{'query':'" + input+ "'}",
                type: 'POST',
                dataType: 'json',
                success: function (response) {
                    return callback(response);
                }
            });
        },
        render: {
            option: function (item, escape) {
                return '<div>' + escape(item.text) + '</div>';
            }
        },
        load: function (query, callback) {
            if (!query.length) return callback();
            $.ajax({
                type: "POST",
                url: "Search.aspx/GetListboxValues",
                data: "{'query':'" + query + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: 'json',
                error: function () {
                    callback();
                },
                success: function (res) {
                    callback(res);
                }
            });
        }
    });



<asp:ListBox ID="stationid" Width="300" SelectionMode="Multiple"  runat="server">
    </asp:ListBox>

在我的aspx.cs中，

In my aspx.cs I have

[WebMethod]
    public static string GetListboxValues(string query)
    {
        string _conString = WebConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
        SqlConnection con = new SqlConnection(_conString);

        SqlCommand cmd = new SqlCommand();
        cmd.Connection = con;
        string sql = "select station_name as [value], station_name as [text]  from station where station_name like '%" + query + "%' group by station_name order by station_name asc";

        cmd.CommandText = sql;
        con.Open();
        DataTable dt = new DataTable();

        using (var da = new SqlDataAdapter(cmd))
        {
            da.Fill(dt);

        }


        return JsonConvert.SerializeObject(dt);

    }

该网络方法有效并以以下格式返回json

The webmethod works and returns a json in the following format

{"d":"[{\" value \:\" IM-987 \，\" text \:\" IM-987 \}，{\" value \:\" S -2987 \，\" text \:\" S-2987 \}，{\" value \:\" S-987 \，\" text \:\" S-987 \}] }

{"d":"[{\"value\":\"I-M-987\",\"text\":\"I-M-987\"},{\"value\":\"S-2987\",\"text\":\"S-2987\"},{\"value\":\"S-987\",\"text\":\"S-987\"}]"}

如果我在列表框中键入内容，那么selectize会添加我正在键入的内容并触发web方法，但列表框中不会填充返回的json值.我该如何解决?预先谢谢你！

If I type in the listbox then selectize adds what I'm typing and fires off the webmethod but the listbox is not populating with the returned json values. How can I solve this ? Thank you in advance!

推荐答案

万一其他人遇到此问题，最可怕的问题是json的格式错误. 我需要使用eval函数仅从json获取文本，因为原始json具有所有这些\"

in case anyone else has this issue, the freaking problem was the json was formatted wrong. I needed to use eval function to get only text from json, because raw json had all those \"

所以只要这样做

success: function (res) {
var rspns = eval(res.d); 
callback(rspns);
}

这篇关于如何使用C#WebMethod动态填充选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！