0

我已经尝试了两个月来让这段代码正常工作，我很接近，但仍然很困惑。我希望 JQuery UI 自动完成函数调用一个 Web 服务，该服务返回 JSON 数据并显示该数据以供选择，并在选择时将所选值放入隐藏字段。

有几个问题：1）自动完成功能没有触发 2）来源：“/AutoSuggest.asmx/DOTFind?” line throws an invalid object exception 3) 服务需要两个参数： (string prefixText, int count) - count 告诉它要返回多少条记录。4) 我完全不确定这段代码是否会接受从服务返回的 JSON 数据

这是代码：<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

无标题页面 

<script type="text/javascript">
    if ($) {
        $(document).ready(
                function() {
                    $('h4').addClass('tmpFrameworkLoaded');
                    $('h4').text('jQuery successfully loaded and running!');
                }
            );
    }

</script>

<style>
    .ui-autocomplete-loading
    {
        background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat;
    }
</style>
<div id="divDOTJQuery" runat="server">

    <script type="text/javascript">
        $(function() {
            function log(message) {
                alert(message);
                $("<div/").text(message).prependTo("#log");
                $("#log").attr("scrollTop", 0);
            }
        });

        $("#dotmatch").autocomplete({
            source: "/AutoSuggest.asmx/DOTFind?",
            minLength: 2,
            select: function(event, ui) {
                log(ui.item ?
                    "Selected: " + ui.item.value + " aka " + ui.item.id :
                    "Nothing selected, input was " + this.value);
            }
        });
    </script>

    <div class="ui-widget">
        DOT Job Title or #:
        <input type="text" id="dotmatch" />
        <input type="hidden" id="DOTNumber" name="DOTNumber" />
    </div>
    <div class="ui-widget" style="margin-top: 2em; font-family: Arial">
        Results:<br />
        <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content">
        </div>
    </div>
</div>
</form>

这是网络服务：

[WebMethod(BufferResponse = true, Description = "Lookup a DOT record using part of DOT Number or DOT Title")]
[ScriptMethod(ResponseFormat=ResponseFormat.Json)]
public string DOTFind(string prefixText, int count)
{
    if (count == 0)
    {
        count = 10;
    }
    DOT D = new DOT();

    DataView DV = D.View(prefixText, count);
    List<DOT> items = new List<DOT>();
    foreach (DataRow DR in DV.Table.Rows)
    {
        items.Add(new DOT(SQL.ColumnToString(DR, "DOTNumber").Trim(),SQL.ColumnToString(DR, "JobTitle").Trim()));
    }
    DataContractJsonSerializer serializer = new DataContractJsonSerializer(items.GetType());
    MemoryStream ms = new MemoryStream();
    serializer.WriteObject(ms, items);
    string jsonString = Encoding.Default.GetString(ms.ToArray());
    ms.Close();
    return jsonString;
}

我非常感谢您能提供的任何帮助。

谢谢，

鲍勃

4

3 回答 3

0

当我使用 FireFox 和 FireBug 时，“代码未触发”问题很容易检测到。我可以看到事件触发线在启动请求时遇到问题。当我调整那条线时，它开始正常发射。然后我遇到了“不能使用GET - 必须使用POST”和“返回的数据以'D'开头”等一系列问题。我处理了它们中的每一个，现在代码可以工作了。当我把它全部清理干净后，我将把它写下来并将结果发布到某个地方。也许在这里。

于 2010-12-01T16:30:53.143 回答
0

我看到您没有指定.autocomplete()应该application/json从您的 Web 服务中获取数据。dataType: "json"通过在对 的调用中指定来做到这一点.autocomplete()。

$("#dotmatch").autocomplete({
        source: "/AutoSuggest.asmx/DOTFind?",
        minLength: 2,
        dataType: "json" //specify dataType
        select: function(event, ui) {
            log(ui.item ?
                "Selected: " + ui.item.value + " aka " + ui.item.id :
                "Nothing selected, input was " + this.value);
        }
    });
于 2010-11-29T20:19:14.207 回答
0

自动完成使用 JSONP，而不是 JSON，

所以添加参数回调=？，或者你喜欢的任何东西

$("#dotmatch").autocomplete({
    source: "/AutoSuggest.asmx/DOTFind?callback=?",
    minLength: 2,
    select: function(event, ui) {
        log(ui.item ?
            "Selected: " + ui.item.value + " aka " + ui.item.id :
            "Nothing selected, input was " + this.value);
    }
});

在网络服务中尝试将 JSON 包装到 callback_value(YOUR_JSON);

但是我不确定在 WebMethods 中获取参数，所以你可以使用通用处理程序（ashx）来代替。

于 2010-11-30T01:14:14.460 回答