【问题标题】:Auto-complete select multiple tags in asp.net在asp.net中自动完成选择多个标签
【发布时间】:2016-03-21 06:43:53
【问题描述】:

任何人都可以告诉我如何在自动完成中使用标记化进行多项选择,我向你保证,我只想要来自 web 服务的 asp.net web 我的代码:

$(function () {
    // Web servcice javascript code for City
    $("[id*=ctl00_ContentMain_TextBoxSkills]").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: '<%=ResolveUrl("~/WebServices/WebServiceSkills.asmx/GetAutoCompleteData")%>',
                data: "{ 'username': '" + request.term + "'}",
                dataType: "json",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    if (data.d.length > 0) {
                        response($.map(data.d, function (item) {
                            return {
                                label: item.split('-')[0],
                                val: item.split('-')[1]
                            };
                        }))
                    } else {
                        response([{ label: 'No results found.', val: -1 }]);
                    }
                }
            });
        },
        select: function (e, u) {
            if (u.item.val == -1) {
                return false;
            }
        }
    });
});

我想使用网络服务从数据库中获取数据并显示在前端以供多选

Web Service:
DataTable dt = userRegistrationHelper.GetSkillsList(username);
        DataRow[] rows = null;
        rows = dt.Select(string.Format("SkillName = {0}", username));
        string[] result = new string[rows.Length];
        for (int i = 0; i <= rows.Length - 1; i++)
        {
            result[i] = rows[i]["SkillName"].ToString();
        }
        return result;

【问题讨论】:

    标签: c# asp.net web-services autocomplete tokenize


    【解决方案1】:
    Autocomplete with multiple words or values with comma separated 
    
       $(function () {
         $("[id*=ctl00_ContentMain_TextBoxSkills]").autocomplete({
        source: function(request, response) {
        $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
         url: '<%=ResolveUrl("~/WebServices/WebServiceSkills.asmx/GetAutoCompleteData")%>',
        data: "{'username':'" + extractLast(request.term) + "'}",
        dataType: "json",
        success: function(data) {
        response(data.d);
        },
        error: function(result) {
        alert("Error");
        }
        });
        },
        focus: function() {
        // prevent value inserted on focus
        return false;
        },
        select: function(event, ui) {
        var terms = split(this.value);
        // remove the current input
        terms.pop();
        // add the selected item
        terms.push(ui.item.value);
        // add placeholder to get the comma-and-space at the end
        terms.push("");
        this.value = terms.join(", ");
        return false;
        }
        });
        $("[id*=ctl00_ContentMain_TextBoxSkills]").bind("keydown", function(event) {
        if (event.keyCode === $.ui.keyCode.TAB &&
        $(this).data("autocomplete").menu.active) {
        event.preventDefault();
        }
        })
        function split(val) {
        return val.split(/,\s*/);
        }
        function extractLast(term) {
        return split(term).pop();
        }
        });
    

    【讨论】:

    • 你好@Manish,我正在使用你提供的这段代码,但这段代码正在调用我的网络服务方法,它给了我错误
    • 感谢@Manish 的帮助,现在我解决了这个问题。
    猜你喜欢
    • 2011-06-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-10-06
    • 1970-01-01
    • 1970-01-01
    • 2023-01-31
    • 1970-01-01
    相关资源
    最近更新 更多