1

我觉得对此有一个简单的答案,但是在将我的 JSON 数据返回到 JQuery UI 自动完成功能时遇到了问题。我正在使用“标签”和“值”字段,所以我可以存储一个 id 字段。问题是一旦将对象中的值传递回 JQuery 函数,我就无法解析它们。

在 ASP.NET C# 中,我有一个对象:

public class AutoCompleteItem
{
    public string label { get; set; }
    public string value { get; set; }
}

并将它们设置为列表,格式化为 JSON,然后返回:

List<AutoCompleteItem> autoCompleteItems = new List<AutoCompleteItem>();
// Loop through data, add objects to list
var oSerializer = new JavaScriptSerializer();
string sJSON = oSerializer.Serialize(autoCompleteItems);
return sJSON;

传递给 JQuery 后的 JSON 数据:

"[{"label":"Steve","value":"ID4545"},{"label":"Joe","value":"ID1212"},{"label":"Rick","value":"ID6767"}]"

这是我用来尝试从 JSON 获取数据的函数:

success: function (data) {
      response($.map(data.d, function (item) {
          return {
              label: item.label,
              value: item.value
          }
                                }));
},

我注意到在使用“标签”、“值”格式之前,我只使用了一个 IList 字符串。传递的数据在外面没有引号,而我原来的例子有

["Steve", "Joe", "Rick"]

我不知道这是否与问题有关,但我尝试了很多方法都无济于事。任何帮助表示赞赏!

4

3 回答 3

2

您显示的 JSON 中没有.d属性。所以:

success: function (data) {
    response(
        $.map(data, function (item) {
            return {
                label: item.label,
                value: item.value
            };
        })
    );
},

但是,如果您使用 ASP.NET Page 方法,那么您拥有 .d 属性,并且您不需要手动序列化 JSON。例如,您可以在后面的代码中使用以下 PageMethod:

[WebMethod]
public static List<AutoCompleteItem> GetAutoCompleteValues(string term)
{
    // the term variable will contain what the user entered so far

    var autoCompleteItems = new List<AutoCompleteItem>();
    // Loop through data, add objects to list
    return autoCompleteItems;
}

接着:

source: function(request, response) {
    $.ajax({
        url: '/foo.aspx/GetAutoCompleteValues',
        type: 'POST',
        contentType: 'application/json',
        data: JSON.stringify({ term: request.term }),
        success: function(data) {
            response(
                $.map(data.d, function(item) {
                    return {
                        label: item.label,
                        value: item.value
                    };
                });
            );
        })
    });
});
于 2012-04-12T19:18:36.927 回答
0

您不需要转换 JSON 响应 - jQuery UI 已经在期待这些令牌。

来自 jQuery UI 文档:

$(function() {
        function log( message ) {
            $( "<div/>" ).text( message ).prependTo( "#log" );
            $( "#log" ).scrollTop( 0 );
        }

        $( "#birds" ).autocomplete({
            source: "search.php",
            minLength: 2,
            select: function( event, ui ) {
                log( ui.item ?
                    "Selected: " + ui.item.value + " aka " + ui.item.id :
                    "Nothing selected, input was " + this.value );
            }
        });
    });

您可以直接访问项目的valueid属性,因为 jQuery 传递给这些事件处理程序的第二个参数(在文档示例中select:)。不需要转换。

于 2012-04-12T19:19:27.107 回答
0

为什么JavaScriptSerializer()首先使用?你只需要

 public ActionResult GetUserAutoComplete(string term)
 {  
      var users = _userRepository.GetUsersByTerm(term);
      var autoCompleteData = users.Select(x => new { label = x.Name + " " + x.Surname, value = x.Name + " " + x.Surname, id = x.UserId, }).ToArray();
      return Json(data, JsonRequestBehavior.AllowGet);
}
于 2012-04-12T19:26:22.047 回答