Skip to main content
 首页 » 编程设计

c#之MVC5 通过 Jquery Ajax 返回通用对象列表

2024年02月06日40unruledboy

我正在尝试通过 jQuery Ajax 检索对象列表

我有一个这样的 Controller 方法:

[HttpGet] 
public JsonResult GetAllStates(string listname = "") 
{ 
     clsDdl ddl = new clsDdl(); 
     List<clsDdl> retval = new List<clsDdl>(); 
     ddl.id = "1"; 
     ddl.value = "Dropdown1"; 
     ddl.status = "DDL Status"; 
     ddl.attributes = "First Dropdown Text"; 
     retval.Add(ddl); 
 
     //return retval; 
     return Json(new 
     { 
         list = retval 
     }, JsonRequestBehavior.AllowGet); 
} 

这是我要返回的 Dropdown 类

public class clsDdl 
{ 
    public string id { get; set; } 
    public string value { get; set; } 
    public string status { get; set; } 
    public string attributes { get; set; } 
} 

代码在我看来是这样的

 function LoadListItems (options) { 
 
 var listname = options.listname; 
 
$.ajax({ 
         type: "GET", 
         url: url, 
         data: JSON.stringify({ 
             listname: listname 
         }), 
         contentType: "application/json; charset=utf-8", 
         async: true, 
         success: function (result) { 
            alert(result[0].value); 
         }, 
         error: function (xhr, status, err) { 
           alert(err.toString(), 'Error - LoadListItemsHelper'); 
         } 
       }); 

我的 Controller Action 被击中了。但警报始终为“未定义”。 我也试过了

 success: function (data) { 
                 var result = data.d; 
                 for (var i = 0; i < result.length; i++) { 
                 alert(result[i].attributes); 
                 } 

那里也没有成功。我究竟做错了什么 ?

提前致谢...

请您参考如下方法:

1. 您正在从服务器返回 JSON。 您必须将 Ajax 请求中的 dataType 设置为 json

  1. contentType --> 数据发送到服务器

  2. dataType --> 服务器返回的数据

What is content-type and datatype in an AJAX request?

      $.ajax({ 
        type: "GET", 
        url: url, 
        data: JSON.stringify({  listname: listname }), 
        contentType: "application/json; charset=utf-8", 
 
//HERE 
        dataType: 'json', 
        success: function (result) { 
              alert(result[0].value); 
        }, 
        error: function (xhr, status, err) { 
               alert(err.toString(), 'Error - LoadListItemsHelper'); 
        } 
    }); 

2.

你回来了

return new Json(new {list = retval}, JsonRequestBehavior.AllowGet); 

在成功:函数(结果)

您可以像这样访问列表:result.list[index]

success: function (result) { 
 
      for(var i =0; i < result.list.length; i++){ 
 
         alert(result.list[i].value); 
         alert(result.list[i].status); 
      } 
} 

编辑 根据 Aivan Monceller 的评论,您可以这样做:

当您发送 GET 时,您不需要

contentType: "application/json; charset=utf-8", 

所以你可以这样写 Ajax:

      $.ajax({ 
        type: "GET", 
        url: url, 
        data: {  listname: listname }, 
 
//HERE 
        dataType: 'json', 
        success: function (result) { 
              alert(result[0].value); 
        }, 
        error: function (xhr, status, err) { 
               alert(err.toString(), 'Error - LoadListItemsHelper'); 
        } 
    });