Не работает Ajax-форма в ASP.NET MVC, в чем причина(код внутри)?

Почему не добавляется через AJAX частичное представление?
Код Частичного представления:
NewRecord.cshtml

@model Organizer.Models.Record
<tr>
    <td>@Html.DisplayFor(m => m.TypeRecord)</td>
    <td>@Html.DisplayFor(m => m.Theme)</td>
    <td>@Html.DisplayFor(m => m.DateTimeBegin)</td>
    <td>@Html.DisplayFor(m => m.DateTimeEnd)</td>
    <td>@Html.DisplayFor(m => m.Place)</td>
</tr>



Код Controller-a

using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Organizer.Models;

namespace Organizer.Controllers {
    public class HomeController : Controller {

        OrganizerContext db = new OrganizerContext();

        [HttpGet]
        public ActionResult Index() {

            IEnumerable<Record> allRecords = db.Records.ToList(); 
            return View(allRecords);
        }

        [HttpPost]
        public ActionResult Add(Record record) {

            db.Records.Add(record);
            db.SaveChanges();
            return PartialView(record);
        }

        protected override void Dispose(bool disposing) {
            db.Dispose();
            base.Dispose(disposing);
        }

    }
}


Код представления (тут должно подгружаться частичное представление):
Index.cshtml

@using Organizer.Models
@model IEnumerable<Record>

@{
    ViewBag.Title = "Organizer";
}

<div>
    <table>
        
        @foreach (Record record in Model) {
            <tr>
                <td>@record.TypeRecord</td>
                <td>@record.Theme</td>
                <td>@record.DateTimeBegin</td>
                <td>@record.DateTimeEnd</td>
                <td>@record.Place</td>
            </tr>
        }
    </table>
</div>

@using (Ajax.BeginForm("Add", new AjaxOptions { UpdateTargetId = "records" })) {
    <table id="tableRecord">
        <tr>
            <td class="tableRow selectRow">
                <select id="listTypeRecord" name="TypeRecord">
                    <option value="Встреча">Встреча</option>
                    <option value="Дело">Дело</option>
                    <option value="Памятка">Памятка</option>
                </select>
            </td>
            <td class="tableRow"><input class="tableInput" type="text" placeholder="Тема" name="Theme"/></td>
            <td class="tableRow"><input class="tableInput" type="text" placeholder="Дата начала" name="DateTimeBegin"/></td>
            <td class="tableRow hidingField"><input class="tableInput" type="text" placeholder="Дата окончания" name="DateTimeEnd"/></td>
            <td class="tableRow hidingField"><input class="tableInput" type="text" placeholder="Место встречи" name="Place"/></td>
        </tr>
    </table>
    <input class="btnCreate" type="submit" name="createRecord" value="Создать запись">
}

<div id="records"></div>
@section Scripts {
    @Scripts.Render("~/Scripts/jquery-3.1.1.min.js")
    @Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
}

  • Вопрос задан
  • 720 просмотров
Пригласить эксперта
Ответы на вопрос 1
Krokor
@Krokor
Студент SFU, .NET developer.
Блок (div id="records") вынесен за пределы формы асинхронной загрузки.
А так же не совпадение имён объекта который отправляешь на сервер (record), ибо именования должны совпадать с атрибутом name у объекта html разметки в форме асинхронной загрузки.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы