如何在EF MVC中使用父对象和子对象列表发布和捕获视图模型? [英] How to POST and Catch a view model with a parent object and list of child objects in EF MVC?
问题描述
我想添加一个家庭，其中有许多成员，并且可以有许多房屋.我正在尝试制作一个表单，并将对象族与其他对象的集合一起提交.我尝试了几件事，但是只能将一个对象传递给控制器，而不能传递给集合.我该怎么办?
我应该将成员视图和房屋视图作为局部视图，并在视图中呈现它们吗?
通过收集JavaScript中的所有内容，然后将整个系列对象传递给控制器，有什么方法可以做到这一点?
我将MVC 5与Entity Framework结合使用.我无法解决此问题.感谢您的帮助.
I want to add a family which has many members and can have many houses. I am trying to make a form and submit the object family with collection of other objects. I have tried few things but I can only get one object to pass to controller and not the collection. What can i do?
should i make member and house partial views and render them in the view ??
Is there any way of doing this with collecting everything in JavaScript and then passing a whole family object to the controller?
I am using MVC 5 with Entity Framework. I am not able to solve this problem. Any help is appreciated.
这是对象的一个例子
here is an example of objects
public class family
{
public int id { get; set; }
public int familyname { get; set; }
public List<member> members { get; set; }
public List<house> houses { get; set; }
}
public class member
{
public int id { get; set; }
public string name { get; set; }
public DateTime birthdate { get; set; }
//foreign key
public family Family { get; set; }
public int FamilyID { get; set; }
}
public class house
{
public int id { get; set; }
public int number { get; set; }
public string address { get; set; }
//foreign key
public family Family { get; set; }
public int FamilyID { get; set; }
}
public class FamilyViewModel
{
public family Family { get; set; }
public member Member { get; set; }
public house House { get; set;}
public List<member> Members { get; set; } //??
public List<house> Houses { get; set; } //??
}
查看
@model WebApp.ViewModels.FamilyViewModel
@{
ViewBag.Title = "New";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Family</h2>
@using (Html.BeginForm("Submit", "Family"))
{
<div class="form-group">
@Html.LabelFor(m => m.Family.familyname)
@Html.TextBoxFor(m => m.Family.familyname, new { @class = "form-control"})
</div>
<div id="member">
</div>
<div id="house">
</div>
}
控制器
[HttpPost]
public ActionResult Submit(FamilyViewModel CompleteFamily)
{
//What to do here?
return View();
}
推荐答案
首先，请在家庭课程中将 familyname 的数据类型更改为 string .并且 FamilyViewModel 与您的 family 类相同.
First of all please change the datatype of familyname to string, inside family class. And FamilyViewModel will be same as your family class.
目前，我正在从事具有此类功能的MVC项目.在这种情况下，请首先 保存家庭的数据.保存时，成员和房屋将为空. 例如，第一次保存数据，然后假设此处的家庭ID为1，家庭名称为John，成员和房屋将为空. 希望您能理解到这一点.
Currently I'm working on a MVC project that have this type of functionality. See, in this case, first you need to save data for family. While saving, members and houses will be null. For example, for the first time you are saving data, then suppose here family id is 1, familyname is John, members and houses will be null. Hope you understood till this.
您已经为成员和房屋渲染了两个局部视图.在主视图中提供两个按钮(不过是您的家庭视图). 1个用于添加成员，另外1个用于添加房屋.因此，当用户单击添加成员"时，将显示一个弹出模式或您想要的任何内容，用户可以在其中提交家庭成员.房屋也是如此.
You already render two partial view for members and houses. Provide two buttons in the main view(that is nothing but your family view). 1 is for Add Members and another 1 is for Add Houses. So when user click on Add Members show one popup modal or anything you want, where user can submit family members. Similarly for houses.
然后在保存家庭成员时(我的意思是当他们单击成员弹出模式中的SAVE按钮时)，只需调用jquery/ajax函数并将您的数据发布到控制器方法中，包括当前的家庭ID .
Then while saving family members (I mean when they click on SAVE button in members popup modal), just call a jquery/ajax function and post your data to controller method including the current family Id.
查看我的下面的代码，
//这将在成员的弹出模式内
//This will be inside a popup modal for members,
<div class="row with-forms">
<div class="col-md-12">
<h5>Member Name</h5>
<input class="search-field" type="text" name="name" id="memberName" />
</div>
<div class="col-md-12">
<h5>Birth Date</h5>
<input class="search-field" type="text" name="DOB" id="memberDOB" />
</div>
<div class="col-md-12">
<input class="btn btn-success" type="button" id="saveMembers" />
</div>
</div>
///我的jquery/ajax代码用于保存成员数据
//My jquery/ajax code to save members data
$("#saveMembers").click(function () {
var membersData = [{
name: $("#memberName").val(),
birthdate: $("#memberDOB").val()
})
var CompleteFamily = {
id: $("#hiddenFamilyId").val(), //keep your familyId in a
//hidden field in same page
members: membersData,
//houses: houseData //similarly u can add house data here
}
$.ajax({
"url": "/yourControllerName/FamilyViewModel",
"type": "Post",
"data": CompleteFamily,
success: function (data) {
//show a message that member added to this family
}
})
就这样.然后，您可以将数据保存在Action方法中.这样，您可以在相同的ajax方法中发布相同familyId的房屋数据.
Thats it. Then you can save your data in Action method. Like this you can post houses data for the same familyId in same ajax method.
在控制器的Action方法中，您可以像这样进行验证
In your controller Action method you can validate like this,
public ActionResult Submit(FamilyViewModel CompleteFamily)
{
if(FamilyViewModel.id == 0)
// This is a new entry to family.
// Return your new familyId in a viewBag and keep that in a hidden field
//in your view HTML
else
{
//You just need to update the family. I mean, here you are adding
//members and houses to the respective family Id.
}
}
看，别忘了在viewBag或您想要的内容中返回familyId，并将其保留在HTML的隐藏字段中.因此只有您可以将成员/房屋添加到相应的ID.就像我在上述ajax中传递数据的方式一样.
See, dont forget to return your familyId in a viewBag or what ever you want, and keep that in a hidden field in HTML. So that only you can add members/houses to that respective Id. Like the way I'm passing data in the above ajax.
例如，您的HTML格式的familyId(例如波纹管)
For example, your familyId in HTML like bellow,
<input type="hidden" id="hiddenFamilyId" value="@ViewBag.familyId"/>
希望它可以解决您的问题.干杯...
Hope it solve your problem. Cheers...
这篇关于如何在EF MVC中使用父对象和子对象列表发布和捕获视图模型?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
