使用Select2和Webservice加载远程数据

时间:2017-07-26 22:10:09

标签: web-services jquery-select2 jquery-select2-4

我在我的网络表单.net应用程序中使用Select2 4.0.3。我正在尝试使用Web服务加载远程数据,但它没有按预期工作。

我面临的第一个问题是没有调用webservice方法并且出现控制台错误:

System.InvalidOperationException: Missing parameter: text.
   at System.Web.Services.Protocols.ValueCollectionParameterReader.Read(NameValueCollection collection)
   at System.Web.Services.Protocols.HtmlFormParameterReader.Read(HttpRequest request)
   at System.Web.Services.Protocols.HttpServerProtocol.ReadParameters()
   at System.Web.Services.Protocols.WebServiceHandler.CoreProcessRequest()

所以我尝试从网络服务电话中删除参数

<WebMethod()> _
Public Function GetDataFromService() As String

这样做会触发该方法,但仍然没有填充select2中的项目(屏幕截图为enter image description here)。

有人可以帮我弄清楚我在哪里弄错了。

以下是详细信息:

在Webform中选择2代码:

 $("#ddlEntity").select2({
        ajax: {
            url: "Service/InvoiceHTMLService.asmx/GetDataFromService",
            type: 'POST',
            delay: 250,
            params: {
                contentType: 'application/json; charset=utf-8'
            },
            dataType: 'json',
            data: function (term, page) {
                return {
                    text: term,
                };
            },
            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
    });

WebService Method:
    <WebMethod()> _
    Public Function GetDataFromService(text As String) As String 
        Return "{['id':1, 'text':'Test1'],['id':2, 'text':'Test2']}"
    End Function

2 个答案:

答案 0 :(得分:0)

请试试这个

var fd = new FormData();
fd.append("text",term);
ajax: {
 url: "Service/InvoiceHTMLService.asmx/GetDataFromService",
 type: 'POST',
 delay: 250,
 params: {
   contentType: 'application/json; charset=utf-8'
 },
 dataType: 'json',
 data: fd
 ...

答案 1 :(得分:0)

我认为你没有为这个select2创建模板。因为您正在使用templateResult和templateSelection,所以它需要模板,或者您可以删除这两个选项。

供参考:https://select2.github.io/examples.html#templating

更新:

他们已经从

更改了查询回调
        data: function (term, page) {
            return {
                text: term,
            };
        },

进入

   data: function (params) {
  return {
    q: params.term, // search term
    page: params.page
  };
},