0

我正在尝试让 jQuery UI AutoComplete 小部件与 WebForms 应用程序中的远程数据源一起工作。我成功调用了我的 Web 服务，但控件没有弹出包含返回项目的列表。

这是我的标记：

<p>
    <label for="birds" class="fieldLabel">Company:</label>
    <input id="existingProgramCompanyName" type="text" style="width: 350px" />
</p>

这是我的脚本：

$("#existingProgramCompanyName").autocomplete({
    source: "/Services/ProgramListServices.asmx/FilteredProgramList",
    minLength: 3,
    select: function (event, ui) {
        alert('Got it!');
    }
});

每当我过去这样做时，我最大的问题是以正确的格式返回数据。AutoComplete 小部件需要 JSON，因此我花了相当多的时间让我的代码返回有效的 JSON。这是从我的 Web 服务返回的实际字符串：

{
  "Companies":[{"Id":"1","Value":"First","Label":"First"},
               {"Id":"2","Value":"Second","Label":"Second"},
               {"Id":"3","Value":"Third","Label":"Third"}],
  "HasData":true,"Message":"","Success":true
}

那是有效的JSON吗？

该控件正确显示了小动画加载图像。我的 Web 服务正在被调用，并且返回时没有错误。但是 AutoComplete 控件永远不会弹出列表。

到目前为止，有没有人看到我所拥有的任何问题？尝试解决此问题的下一步是什么？

4

1 回答 1

1

是的，您的字符串是有效的 JSON，但这并不意味着 AutoComplete 可以使用它。格式可以在Autocomplete Widget Source中看到。我认为这特别适用于您的来源案例：

* An array of strings: [ "Choice1", "Choice2" ]
* An array of objects with label and value properties: [ { label: "Choice1", value: "value1" }, ... ]

您的提要生成的内容将无法按预期工作，无论您是否将其括在括号中（您将需要括号）：

$("#existingProgramCompanyName").autocomplete({
    source: {"Companies": [{ "Id": "1", "Value": "First", "Label": "First" },
        { "Id": "2", "Value": "Second", "Label": "Second" },
        { "Id": "3", "Value": "Third", "Label": "Third"}],
        "HasData": true, "Message": "", "Success": true
        }
    });

但是，这个稍作修改的版本将（注意大小写为小写）：

 $("#existingProgramCompanyName").autocomplete({
     source: [{ "value": "First", "label": "First" },
              { "value": "Second", "label": "Second" },
              { "value": "Third", "label": "Third"}]
     });

因此，要修复，我会调整您的 JSON 提要以输出不同的格式！

更新：也许只是尝试使用字符串数组选项进行测试：

List<string> s = new List<string>();
//populate the list
return new JavaScriptSerializer().Serialize(s);
于 2013-10-03T18:42:10.393 回答