使用ajax和分页,使用ASP下拉列表控件选择2

时间:2016-10-09 13:29:25

标签: c# jquery asp.net ajax select2

Fist I使用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\>尝试了这个,但是没有使用webMethods 我只是想让它工作并从webMethod或asp:DropDownList自带或从任何其他方式带来数据

如果不可能的话?我如何使用<select\>标记或

来做到这一点

2 个答案:

答案 0 :(得分:1)

(我知道差不多一年之后,但以防它对其他人有用)我遇到了同样的问题,我做的就是补充:

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

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

似乎select2

需要contentType

答案 1 :(得分:0)

您可以将select2与下拉clientID结合使用:-

  $(document).ready(function () {            

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

          placeholder: "Select Item",

          allowClear: true

      });

  });

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

有关更多信息,请参见: https://c-sharplibrary.blogspot.com/2017/08/create-select-2-dropdownlist-in-aspnet-c.html