使用 ajax 和分页的带有 ASP 下拉列表控件的 Select2答案

【问题标题】：Select2 with ASP dropdownlist control using ajax and paging使用 ajax 和分页的带有 ASP 下拉列表控件的 Select2
【发布时间】：2017-02-18 01:00:49
【问题描述】：

拳头我使用 ASP.Net 下拉列表，因为它是我使用的事件

<asp:DropDownList ID="e24" runat="server" class="form-control select2">
<asp:ListItem Text="--إختر--" Selected="True" Value="0" />
<asp:ListItem Text="مفتوحة" Value="OPN" />
<asp:ListItem Text="مغلقة" Value="CLO" />
</asp:DropDownList>

我想使用 select2 并使用 asp:DropDownList 的分页功能

我用 ajax 试过了

$(document).ready(function () {
        //$("#e24").select2();

        $("#e24").select2({
            ajax: {
                url: '<%= ResolveUrl("~/ar/UserControls/WebForm1.aspx/getResults") %>',
                dataType: 'json',
                delay: 100,
                data: function (params) {
                    //alert(params.page);
                    return {
                        q: params.term, // search term
                        page: params.page
                    };
                },
                processResults: function (data, params) {

                    // parse the results into the format expected by Select2
                    // since we are using custom formatting functions we do not need to
                    // alter the remote JSON data, except to indicate that infinite
                    // scrolling can be used
                    params.page = params.page || 1;

                    return {
                        results: data.items,
                        pagination: {

                            more: (params.page * 30) < data.total_count
                        }
                    };
                },
                cache: true
            },
            //escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
            minimumInputLength: 1,
            //templateResult: formatRepo, // omitted for brevity, see the source of this page
            //templateSelection: formatRepoSelection // omitted for brevity, see the source of this page
        }

        );
    });

和 C# 代码

 [System.Web.Services.WebMethod]
    [System.Web.Script.Services.ScriptMethod(ResponseFormat = System.Web.Script.Services.ResponseFormat.Json)]
    public static String getResults(String q, String page_limit)
    {
        return "[{ \"id\": \"1\", \"text\": \"test\" }]";
    }

拳头 ajax 不触发，不工作！我怎样才能让它工作我也用<select\> 试过这个，但是stile ajax 不能与webMethods 一起工作我只希望它工作并从 webMethod 或 asp:DropDownList 它自己或从任何其他方式获取数据

如果不可能？我怎么能用<select\>标签或其他方式做到这一点

【问题讨论】：

标签： c# jquery asp.net ajax select2

【解决方案1】：

（我知道已经快一年了，但以防万一它对其他人有用）我遇到了同样的问题，我所做的就是添加：

contentType: "application/json; charset=utf-8",
type: 'POST',

还有

data: function (params) {
     return JSON.stringify({ q: params.term, page_limit: 10 });
}

看来 select2 需要 contentType

【讨论】：

【解决方案2】：

您可以将 select2 与下拉客户端 ID 一起使用：-

  $(document).ready(function () {            

      $("#<%=DropDownList1.ClientID%>").select2({

          placeholder: "Select Item",

          allowClear: true

      });

  });

  <asp:DropDownList ID="DropDownList1" runat="server"  CssClass="form-control input-sm"></asp:DropDownList>

【讨论】：

您应该考虑在答案中包含一些有关如何使用带有下拉 clientID 的 select2 的更多信息（它需要在没有链接的情况下自行支持）