MVC 3 - Добавление нескольких объектов к объекту

Question

У меня есть такие классы:

public class member
{
 public string name {get;set;}
 public IList<Note> notes {get;set;}
}

public class note
{
 public string text {get;set;}
 public datetime created {get;set;}
}

Я хочу, чтобы у меня была страница, которая вставляет класс члена - с этим у меня все в порядке.Мой вопрос заключается в том, как добавить несколько заметок участнику на одной странице?

Как лучше всего это сделать?(может быть, какое-нибудь ajax-решение для отображения подформ для класса заметок)

Может ли кто-нибудь указать мне правильное направление некоторых связанных примеров учебных материалов?

Answer 1

Я бы создал форму Ajax, которая отправляет на ваш контроллер метод с именем AddNote(AddNoteViewModel viewModel). AddNoteViewModel будет содержать всю информацию, необходимую для создания новой заметки. Метод действия AddNote добавит новую заметку SaveChanges и выдаст список заметок для данного участника. Вы можете использовать частичное представление для содержимого, которое возвращается из AddNote.

В форме Ajax вы должны установить UpdateTargetId на идентификатор <div>, который вы хотите обновить с последним списком заметок.

Другим вариантом может быть использование JQuery.

Вот хороший пример обоих: Использование Ajax.BeginForm с ASP.NET MVC 3 Razor

ОБНОВЛЕНИЕ: Я адаптировал пример Дарина Димитрова (по ссылке) в соответствии с вашим сценарием. Это не в моей голове, поэтому не будет идеальным, но оно должно дать вам достойную отправную точку

Модель:

public class AddNoteViewModel
{
    [Required]
    public int MemberId { get; set; }
    [Required]
    public string Text { get; set; }
}

Контроллер:

    [HttpPost]
    public ActionResult AddNote(AddNoteViewModel model)
    {
        var member = //Get member from db using model.MemberId
        member.Notes.Add(new Note{Text = model.Text, Created = DateTime.Now});
        //SaveChanges();

        var notes = //Get notes for member

        return View(notes);
    }

Вид:

@model AppName.Models.AddNoteViewModel

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>

<div id="result"></div>

@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "result" }))
{
    @Html.HiddenFor(x => x.MemberId)
    @Html.EditorFor(x => x.Text)
    @Html.ValidationMessageFor(x => x.Text)
    <input type="submit" value="OK" />
}

Использование JQuery:

Вид:

@model AppName.Models.AddNoteViewModel

<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/index.js")" type="text/javascript"></script>

<div id="result"></div>

@using (Html.BeginForm())
{
    @Html.HiddenFor(x => x.MemberId)
    @Html.EditorFor(x => x.Text)
    @Html.ValidationMessageFor(x => x.Text)
    <input type="submit" value="OK" />
}

index.js:

$(function () {
    $('form').submit(function () {
        if ($(this).valid()) {
            $.ajax({
                url: this.action,
                type: this.method,
                success: function (result) {
                    $('#result').html(result);
                }
            });
        }
        return false;
    });
});