Jquery UI自动完成不显示结果

Question

我知道问题标题似乎重复，但我一直无法找到此问题的答案。

我正在使用 Jquery UI 的自动完成功能，我可以在调试器中看到正确的 JSON 数据。但是，文本框没有返回任何内容。

我的javascript：

<script type="text/javascript">
    $(document).ready(function () {
        myAutoComplete("#<%= myTxtBox.ClientID %>", "AutoCompletePage.aspx");
    });

    function myAutoComplete(ObjectId, DataURL) {
        $(ObjectId).autocomplete({
            source: function (request, response) {
                $.ajax({ url: DataURL, dataType: 'jsonp',
                    data: { q: request.term, limit: 10 },
                    success: function (data) {
                        response($.map(data, function (item) {
                            return { label: item[1], value: item[0], id: item[0]}
                        }))
                    }
                })
            }
        });
    }

</script>

来自我的 AutoCompletePage.aspx 页面的 sn-p：

foreach (DataRow dataRow in dataTable.Rows)
{
    string[] cells = new string[] { dataRow[0].ToString(), dataRow[1].ToString() };
    output.Add(cells);
}

后来……

Response.Write(json.Serialize(output));

您可以在这张图片中看到 JSON 数据正在被返回，但我的文本框没有发生任何事情。提前感谢任何可以提供帮助的人。

Answer 1

我有一种预感，你不应该在这里使用jsonp。 JSONP一般用于跨域请求。

您似乎是在同一个域中发出请求（另外，返回的数据可能没有回调函数可以调用），所以您只需使用普通的json 就可以了。

尝试将datatype 参数更改为json：

    $(ObjectId).autocomplete({
        source: function (request, response) {
            $.ajax({ url: DataURL, dataType: 'json',
                data: { q: request.term, limit: 10 },
                success: function (data) {
                    response($.map(data, function (item) {
                        return { label: item[1], value: item[0], id: item[0]}
                    }))
                }
            })
        }
    });