编辑 3 / 最终
这是使用 .NET MVC、Jquery 和编辑器模板的完整示例。 https://www.dropbox.com/s/t4yxbhkuowyd7va/exerciseTest.rar
编辑 2
它终于奏效了!感谢下面的答案。看来我需要更改 NewAnswerRow 部分行:
<input type='text' id='Answers_@(Model.AnswerId)__Answer' name='Answers[@Model.AnswerId].Answer'/>
谢谢 !
编辑1:
我遵循了本指南: http ://www.techiesweb.net/asp-net-mvc3-dynamically-added-form-fields-model-binding/
有趣的是,当我使用他的资源时,它的工作原理应该是这样。但它几乎完全一样。
原帖
首先感谢您阅读此消息,并愿意提供帮助。我大吃一惊。让我试着解释一下我的情况。我正在尝试创建一个包含答案列表的新练习。这些答案是使用 Jquery 即时创建的。我正在使用 EditorTemplates 阅读这些答案。一切正常,除了当我创建新的“答案”字段并按“发布”时,我的控制器看不到任何数据(答案)。奇怪的是。例如,当我在 answer 属性中使用 [required] 之类的数据注释时。我被重定向到索引。当我再次尝试时,我的模型不再是空的。
所以基本上我的问题是,我怎样才能设法将这些答案放入我的列表中?
我已经为你们创建了一个新项目,以便更加清晰和具体。
我有2个模型,
锻炼
答案
运动模型类
[Table("Exercise")]
public class ExerciseModel
{
[Key]
public int ExerciseId { get; set; }
public string Question { get; set; }
public IList<AnswerModel> Answers { get; set; }
}
它基本上是一个简单的类。如你们所见。有一个带有答案的列表。
答案模型
[Table("Answer")]
public class AnswerModel
{
[Key]
public int AnswerId { get; set; }
public string Answer { get; set; }
}
一个带有 Id 和 Answer 的简单 AnswerModel 类。
我的控制器
public class ExerciseController : Controller
{
private readonly DataContext db = new DataContext();
//
// GET: /Exercise/
public ActionResult Index()
{
var exercise = new ExerciseModel();
exercise.Answers = GetAnswers();
return View(exercise);
}
[HttpPost]
public ActionResult Index(ExerciseModel exercisemodel)
{
//need to implement interaction with database (not yet) testing phase.
return View("PostedData", exercisemodel);
}
public ActionResult NewAnswersRow(int id)
{
var answers = new AnswerModel { AnswerId = id };
return View("partial/NewAnswersRow", answers);
}
private List<AnswerModel> GetAnswers()
{
var answerslist = new List<AnswerModel>();
answerslist.Add(new AnswerModel { AnswerId = 1, Answer = "This is a hardcoded answer"}); //normally db.Answers (for testing purposes)
return answerslist;
}
}
我的索引视图
@model exerciseTest.Models.ExerciseModel
@using (Html.BeginForm())
{
<div class="divAnswers">
<div id="container">
<div class="editor-label">
@Html.LabelFor(model => model.Question)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Question)
@Html.ValidationMessageFor(model => model.Question)
</div>
@Html.EditorFor(m => m.Answers)
</div>
<input type="button" id="btnAdd" value="Add New Item" />
</div>
<p>
<input type="submit" value="Save" />
</p>
}
<script>
$(function () {
$("#btnAdd").click(function (e) {
var itemIndex = $("#container input.iHidden").length;
console.debug("itemIndex : "+itemIndex);
e.preventDefault();
$.get("@Url.Action("NewAnswersRow", "Exercise")/"+itemIndex,function(data){
$("#container").append(data);
});
});
});
</script>
我的 AnswerModel 编辑器模板
@model exerciseTest.Models.AnswerModel
@{
Layout = null;
}
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<tr>
<td>
@Html.HiddenFor(x => x.AnswerId, new { @class="iHidden" })
@Html.TextBoxFor(x => x.Answer) </td>
</tr>
我的 NewAnswersRow.cshtml 用于使用 Jquery 动态创建新行(参见代码部分的索引)
@model exerciseTest.Models.AnswerModel
@{ Layout = null; }
<tr>
<td>
<input type="hidden" id="Answers_@(Model.AnswerId)__Id" class="iHidden" name='Answers[@Model.AnswerId].Id' />
<input type='text' id='Answers_@(Model.AnswerId)__AnswersText' name='Answers[@Model.AnswerId].AnswersText'/>
</td>
</tr>
以及用于测试目的的“postedData”视图
@model exerciseTest.Models.ExerciseModel
<h3>Posted data is </h3>
@foreach (var item in Model.Answers)
{
<p>@item.Answer</p>
}
我正在努力让这件事发挥作用。我必须说,在 5 年里,我从来没有在 StackOverflow 上问过一些问题,因为我可以找到答案。但这一次,我需要你的帮助。
谢谢 !