Javascript:如何迭代模型中的对象列表

本文关键字:模型 对象 列表 迭代 何迭代 Javascript | 更新日期: 2023-09-27 17:54:38

所以我需要在视图模型中的学生对象列表中获取学生的姓名,然后通过$将它们发送到服务器。后,后者我已经弄清楚了,但我不能弄清楚如何通过对象列表迭代。这里是:

//Student object
public class Student 
{
    public string FirstName { get; set; }
    public string LastName { get; set; }
    //Like a bunch of other attributes here
} 

这是视图中的模型:

//StudentSearchResult ViewModel
public class StudentSearchResult {
    public IEnumerable<Student> { get; set;}
}

起初我以为只是发送学生列表对象,但它可能不是一个好主意,因为它捆绑了太多的属性(它给了我这个"循环"错误,当我试图发送模型),我只需要发送连接的FirstName和LastName到控制器使用$。post方法我已经有了。我试过这样做:

var names = []  
var length = "@Model.StudentSearchResult.count()";  
for (int i = 0; i < length; i++) 
{
     names[] = "@Model.StudentSearchResult[i].Name + @Model.StudentSearchResult[i].LastName"
}
//$.post function here that calls the controller and send the concatenated names of each student in studentsearchresult.

但我会得到一个错误,"I"不存在,所以,我怎么能在javascript中迭代通过对象列表在我的视图模型,访问属性和连接它们,然后将它们存储在字符串数组,以便我可以将它发送到控制器?我想控制器应该是这样的

[HttpPost]
public ActionResult StudentSearchResult(/*other stuff I send here, */ string[] studentNames){
   //stuff here
  return View();
}

谢谢!

Javascript:如何迭代模型中的对象列表

这里有一些无效的javascript。

首先修复你的视图模型,这样你就有一个编译的c#代码(你丢失了一个属性名):

public class StudentSearchResult 
{
    public IEnumerable<Student> Students { get; set;}
}

然后假设你的控制器动作发送一个JSON结果到客户端(这确保视图模型是正确的JSON编码,并且application/json响应内容类型头被发送):

[HttpPost]
public ActionResult StudentSearchResult(/*other stuff I send here, */ string[] studentNames)
{
    StudentSearchResult model = ... //stuff here to populate your view model
    return Json(model);
}

您可以使用$.each()函数轻松地在客户端上迭代:

var studentNames = ['name1', 'name2'];
$.post('/Students/StudentSearchResult', studentNames, function(result) {
    var students = result.Students;
    $.each(students, function() {
        alert('FirstName: ' + this.FirstName + ' LastName:' + this.LastName);
    });
});

或者甚至一个普通的for循环,如果你喜欢:

$.post('/Students/StudentSearchResult', studentNames, function(result) {
    var students = result.Students;
    for (var i = 0; i < students.length; i++) {
        var student = students[i];
        alert('FirstName: ' + student.FirstName + ' LastName:' + student.LastName);
    }
});

更新:

它看起来像我已经我犯了一个错误,相信你正在执行一个AJAX请求。相反,你需要的是在javascript中访问模型属性。这是如何做到的:

@model StudentSearchResult
<script type="text/javascript">
    var students = @Html.Raw(Json.Encode(Model.Students));
    // students is a javascript array that will look like this:
    // students = [{"FirstName":"fn1","LastName":"ln1"}, {"FirstName":"fn2","LastName":"ln2"}, ...];
    for (var i = 0; i < students.length; i++) {
        var student = students[i];
        alert('FirstName: ' + student.FirstName + ' LastName:' + student.LastName);
    }
</script>

可以使用$。每个jquery迭代结果。

$.each(yourModel,function(){//do with loop});

和错误。循环变量

声明错误
for (var i = 0; i < length; i++) 

看起来您需要的是将用户名作为JSON输出到客户端?试试这个:

var names = @Model.StudentSearchResult.Select(s => new { s.FirstName, s.LastName }).ToList();

我不太熟悉Razor的语法,但我认为你仍然可以理解上面的代码。

for (var i = 0; i < length; i++) 

代替

for (int i = 0; i < length; i++)