【问题标题】:AutoComplete without a WebService?没有 WebService 的自动完成?
【发布时间】:2014-01-22 07:52:05
【问题描述】:

我正在尝试使用带有多个值且以逗号分隔的文本框的自动完成选项,但它会在 jquery 警告框中引发“错误”。

<asp:Content ID="content1" runat="server" ContentPlaceHolderID="AdminHead">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        SearchText();
    });
    function SearchText() {
        $('#<%=txtauthor.ClientID%>').autocomplete({
            source: function (request, response) {
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "Author/Add.aspx/GetAutoCompleteData",
                    data: "{'username':'" + extractLast(request.term) + "'}",
                    dataType: "json",
                    success: function (data) {
                        response(data.d);
                    },
                    error: function (result) {
                        alert("Error");
                    }
                });
            },
            focus: function () {
                return false;
            },
            select: function (event, ui) {
                var terms = split(this.value);
                terms.pop();
                terms.push(ui.item.value);
                terms.push("");
                this.value = terms.join(", ");
                return false;
            }
        });
        $('#<%=txtauthor.ClientID%>').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();
        }
    }
</script>

和文本框

<asp:TextBox ID="txtauthor" Width="700px" runat="server"></asp:TextBox>

和 C# 获取列表

 [WebMethod]
public static List<AuthorDetail> GetAutoCompleteData(string username)
{
    AuthorCalls mcr = new AuthorCalls ();
    return mcr.GetAutoCompleteAuthorName(username);
}

我尝试在要查看的方法上设置断点,但它也没有调用该方法。 我错过了什么?

【问题讨论】:

  • 尝试在错误部分提醒结果而不是 alert("Error");
  • 我很累,但我得到 [object XMLHttpRequest] 错误。

标签: jquery asp.net jquery-ui jquery-ui-autocomplete


【解决方案1】:

根据您为 AJAX 调用提供的 URL,它假定特定脚本的呈现位置与您尝试访问的页面位于相同的相对路径(即文件夹)中。换句话说,假设您的页面位于/applicationPath/search.aspx 下。然后它会假设您正在访问的 URL 位于 /applicationPath/Author/Add.aspx 下,对吗?

或者,您可以通过浏览器的原生 DEV 工具从浏览器中查询网络流量,以查看错误所在。 404 状态意味着无法访问/找到 URL(我怀疑可能是这种情况)。或者,500 状态意味着代码中某处出现异常,我认为这不太可能,因为您甚至无法在代码中命中断点。

【讨论】:

  • 好的。现在网址看起来像“/Author/Add.aspx/GetAutoCompleteData”,但我在 chrome 中检查并显示 500(内部服务器错误)并且在警报中我得到 [object XMLHttpRequest]
  • 500 状态码表示您的代码中某处存在错误。所以尝试通过附加一个调试器来调试你的代码,看看它失败的地方......
  • 好的。我更改了 api url 和对象 XMLHttpReuest 错误,但我现在得到“对象对象”错误。在控制台中我看到 500 错误 - send jquery.js:9597 b.extend.ajax jquery.js:9597 SearchText.$.autocomplete.source Admin:20 t.widget._search jquery-ui.min.js:8 (匿名函数) jquery-ui.min.js:5 t.widget.search jquery-ui.min.js:8 (匿名函数) jquery-ui.min.js:5 (匿名函数) jquery-ui.min.js :8 我
  • "[object Object]" 不一定是错误。尝试在 Chrome 中记录该对象,以便检查该对象的每个单独属性。您仍然获得 500 状态代码这一事实仍然意味着您的后端代码存在问题。尝试调试您的代码,看看发生了什么。
猜你喜欢
  • 2017-08-26
  • 2020-06-07
  • 2012-05-15
  • 2013-10-10
  • 1970-01-01
  • 1970-01-01
  • 2013-07-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多