将数据从 C# 返回到 jQuery UI 自动完成

Question

我想用数据库中的数据填充我的autocomplete。 所以我用c#写了一个方法从db中读取：

public string[] GetNames()
{
    var names = unitOfWork.deviceRepository.Get().Select(w=>w.Name);
    return names.ToArray();
}

这很好用。所有需要的数据都在名称中。

现在我正在使用 Ajax 将这些数据发送到客户端：

$(function () {
    var availableTags;
    $.ajax({
        url: "/DeviceUsage/GetNames",
        type: "GET",
        error: function (data) {
            alert("wystąpił nieokreślony błąd " + data);
        },
        success: function (data) {
            console.log(data);
            availableTags = data;
        }
    })
    $("#deviceName").autocomplete({
        source: availableTags
    });
});

如您所见，我将离开dataType 进行智能猜测。 但是成功的 console.log 在控制台中写入System.String[] 而不是来自GetNames 的数据。 谁能建议我如何修改我的代码以完成自动完成工作？

Answer 1

dataType 不适用于 C# 或 MVC 或服务器端，这是为了告诉 jQuery 你正在使用 json 响应并且 jQuery 应该解析它。由于您没有提供它，jQuery 不会解析它，因此数据只是一个字符串。如果您想要 json，则提供它或使用 JSON.parse 来解析您的数据字符串。

要么 -

$.ajax({
        url: "/DeviceUsage/GetNames",
        type: "GET",
        dataType: "json",
        error: function (data) {
            alert("wystąpił nieokreślony błąd " + data);
        },
        success: function (data) {
            console.log(data);
            availableTags = data;
        }
    })

或 -

$.ajax({
        url: "/DeviceUsage/GetNames",
        type: "GET",
        error: function (data) {
            alert("wystąpił nieokreślony błąd " + data);
        },
        success: function (data) {
            var jsonData = JSON.parse(data);
            console.log(jsonData);
            availableTags = jsonData;
        }
    })

而且，在分配之前，您无需等待 ajax 完成 -

$("#deviceName").autocomplete({
        source: availableTags
    });

你应该等待 ajax 完成，所以像这样在成功中进行这个调用 -

success: function (data) {
            //do proper parsing as mentioned earlier
            availableTags = jsonData;
            $("#deviceName").autocomplete({
                 source: availableTags
             }); 
        }

因为在调用 availableTags 的那一刻，其中没有任何内容。

Answer 2

如果您只是希望以逗号分隔的字符串作为返回值，您可以更改 GetNames 函数以返回 string 并使用 String.Join 函数连接数组。

return String.Join(", ", unitOfWork.deviceRepository.Get().Select(w=>w.Name).ToArray());

---

但我个人建议使用某种类型的 json 值响应并以 json string 的形式返回字符串数组（很容易被 JavaScript 解析）。

类似（使用newtonsoft json.net，以下示例未测试）：

return JsonConvert.SerializeObject(unitOfWork.deviceRepository.Get().Select(w=>w.Name).ToArray());