Skip to main content
 首页 » 编程设计

c#之使用 AJAX 从列表返回属性

2024年02月25日40傻小

我目前正在使用 .NET Core 的 AJAX。我正在尝试做非常基本的事情。填充项目列表,然后显示 <li> 中的每个项目.问题是我发送的列表是来 self 的数据库的类型。因此,如果您滚动到我的 javascript 代码,在执行每个 <li> 之后项目是“未定义的”。我很确定会发生这种情况,因为我正在发送整个对象。

所以我需要在我的 $.each 中有另一个循环来选择 PersonId、PersonName、PersonAddress 并将它们显示在行中。

作为 javascript 和 Ajax 的新手,我真的在这里苦苦挣扎,找不到任何关于 asp.net core 的好教程。

非常感谢任何建议

我的模型是:

public class Person 
{ 
    public int PersonId { get; set; } 
    public string PersonName { get; set; } 
    public string PersonAddress { get; set; } 
} 

我的索引方法:

public JsonResult OnGetList() 
{ 
    List<Models.Person> list = new List<Models.Person>(); 
 
    foreach (var item in _context.Person.ToList()) 
    { 
        list.Add(item); 
    } 
 
    return new JsonResult(list); 
} 

数据库中的数据如下所示:

PersonId PersonName PersonAddress 
1        Martin     New York 
2        Sam        New Jersey 
3        Eli        Ohio 

我的看法:

<div id="dvItems" style="font-size:24px;"> 
</div> 

嵌入在 View 底部的 Javascript:

<script> 
    $.ajax({ 
        type: "GET", 
        url: "/Person?handler=List", 
        contentType: "application/json", 
        dataType: "json", 
        success: function (response) { 
            var dvItems= $("#dvItems"); 
            dvItems.empty(); 
            $.each(response, function (i, item) { 
                var $tr = $('<li>').append(item.PersonId + "with name " + item.PersonName + "living in" + item.PersonAddress).appendTo(dvItems); 
            }); 
        }, 
        failure: function (response) { 
            alert(response); 
        } 
    }); 
</script> 

请您参考如下方法:

这并没有回答原始问题,但值得一提:

你应该(必须?,出于安全原因)在服务器端创建一个 DTO (c#),它包含你想在客户端显示的内容 (javascript >, html).

你可以创建类似这样的东西:

public class PersonDto 
{ 
    public string Name {get; } 
    public string Address { get;} 
 
    public PersonDto(string name, string address) 
    { 
       Name = name; 
       Address = address; 
    } 
} 

然后像这样更改您的代码:

public JsonResult OnGetList() 
{ 
    var list = new List<PersonDto>(); 
 
    foreach (var item in _context.Person.ToList()) 
    { 
        list.Add(new PersonDto(item.PersonName, item.PersonAddress)); 
    } 
 
    return new JsonResult(list); 
}