MVC 5 Ajax Issue

Question

Я изучаю MVC5, и я пытаюсь реализовать простую страницу для добавления и отображения учащихся. Вопрос занимает много места, но является чрезвычайно простым.

Так вот модель:

public class Student 
{ 
    public int StudentId { get; set; } 
    public string Name { get; set; } 
    public int Age { get; set; } 
} 

Вот методы действий:

public ActionResult Index() 
    { 
     return View(db.Students.ToList()); 
    } 

    public ActionResult Create() 
    { 
     return PartialView(); 
    } 


    [HttpPost] 
    [ValidateAntiForgeryToken] 
    public ActionResult Create(Student student) 
    { 
     if (ModelState.IsValid) 
     { 
      db.Students.Add(student); 
      db.SaveChanges(); 
      return PartialView(); 
     } 

     return PartialView(student); 
    } 

Здесь вы вид Родитель: Index.cshtml

@model IEnumerable<MVCAjax.Models.Student> 
<h2>Index</h2> 
<div class="row" id="myformbase"> 
    <div class="col-md-6"> 
     <table class="table"> 
      <tr> 
       <th> 
        @Html.DisplayNameFor(model => model.Name) 
       </th> 
       <th> 
        @Html.DisplayNameFor(model => model.Age) 
       </th> 
       <th></th> 
      </tr> 

      @foreach (var item in Model) 
      { 
       <tr> 
        <td> 
         @Html.DisplayFor(modelItem => item.Name) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Age) 
        </td> 
       </tr> 
      } 

     </table> 
    </div> 
    <div class="col-md-6"> 
     @Html.Action("Create") 
    </div> 
</div> 

Вот вид ребенка: Create.cshtml

@model MVCAjax.Models.Student 
@using (Ajax.BeginForm("Create", "Student", new AjaxOptions { UpdateTargetId = "myform" })) 
{ 
    <div id="myform"> 
     <h2>Create</h2> 
     @Html.AntiForgeryToken() 

     <div class="form-horizontal"> 
      <h4>Student</h4> 
      <hr /> 
      @Html.ValidationSummary(true) 
      <div class="form-group"> 
       @Html.LabelFor(model => model.Name, new { @class = "control-label col-md-2" }) 
       <div class="col-md-10"> 
        @Html.EditorFor(model => model.Name) 
        @Html.ValidationMessageFor(model => model.Name) 
       </div> 
      </div> 

      <div class="form-group"> 
       @Html.LabelFor(model => model.Age, new { @class = "control-label col-md-2" }) 
       <div class="col-md-10"> 
        @Html.EditorFor(model => model.Age) 
        @Html.ValidationMessageFor(model => model.Age) 
       </div> 
      </div> 
      <div class="form-group"> 
       <div class="col-md-offset-2 col-md-10"> 
        <input type="submit" value="Create" class="btn btn-default" /> 
       </div> 
      </div> 

     </div> 
    </div> 
} 

Теперь у меня есть несколько вопросов:

1. Когда я ввожу имя студента и возраст и нажмите кнопку Создать, текстовые поля все еще отображают значения, а не очищаются. Данные сохраняются в db.
2. Что делать, если я хочу обновить список в левой части, как только будет добавлен новый ученик.

У меня есть небольшой опыт MVC4 и там, если я передать (в AjaxOptions) Идентификатор DIV, который содержал оба ребенка дивы (в моем случае «myformbase»), то он используется, чтобы обновить его. Но не знаю, почему это не работает в MVC5.

Answer 1

1. Просто добавьте ModelState.Clear(); после того, как вы сохранили запись в базу данных;

2. Попробуйте изменить UpdateTargetId к базовому контейнер ID:

   @using (Ajax.BeginForm("Create", "Student", new AjaxOptions { UpdateTargetId = "myformbase" })){...}

Answer 2

Когда я ввожу имя студента и возраст и нажмите кнопку создать, текстовые поля до сих пор показывают значение вместо того, чтобы очищаются , Данные сохраняются в дБ.

Правильный способ решить эту проблему - сделать POST-REDIRECT-GET (PRG). В качестве альтернативы вы можете создать пустую модель и связать ее с представлением (я имею в виду Student s = new Student(); return PartialView(s);).

Что делать, если я хочу обновить список в левой части, как только будет добавлен новый ученик .

PRG решит вашу проблему и в этом случае. Поэтому перенаправление на действие индекса после завершения создания. В качестве альтернативы вы можете использовать AJAX GET для действия индекса и загрузить html в представлении.