отправлять и получать данные с помощью Jquery asp.net MVC 4

Question

Я просмотрел несколько постов, пытаясь объяснить это, но большинство из них - просто базовые примеры размещения текста и так далее. Я теперь, что есть возможность использовать Ajax.BeginForm или Jquery для публикации. Я не очень опытный разработчик javascript. Но, может быть, кто-то задумался над тем, что использовать. Хорошо, к коду.

Я создал ViewModel, которая содержит нужные мне данные

 public class AvviksModel
{
    public Avvik Avvik { get; set; }
    public List<AvviksNotat> Notater { get; set; }
    public DateTime AvvikRegistrertTid { get; set; }
    //public List<AnsattModel> Ansatte { get; set; }
    public String NewNote { get; set; }
    public int RegistrertAvAnsNummer { get; set; }        
}

А вот и мои подробности. Посмотреть:

@model EL4.Administrasjon.Models.AvviksModel
<link rel="stylesheet" type="text/css" href="../../Content/Form.css" />
@{
ViewBag.Title = "Details";
}

<h2>@Model.Avvik.Subject</h2>

<div id="contact-area">

  <label for="TidRegistrert">Tid registrert</label>
<input type="text" name="TidRegistrert" id="TidRegistrert" value="@Model.Avvik.RegistrertTid" readonly="true" />

<label for="ansnr">Avviks ID</label>
<input type="text" name="AvviksID" id="AvviksID" value="@Model.Avvik.AvviksID" readonly="true" />

<label for="ansnr">Kategori</label>
<input type="text" name="cat" id="cat" value="@Model.Avvik.AvviksKategori.Navn" readonly="true" />

<label for="GjelderAns">Gjelder ansatt</label>
<input type="text" name="gjelderAns" id="gjelderAns" value="@Model.Avvik.GjelderAnsattNr" readonly="true" />

<label for="RegistrertAvAns">Registrert av</label>
<input type="text" name="RegistrertAvAns" id="RegistrertAvAns" value="@Model.Avvik.RegistrertAvIDAnsNr" readonly="true" />                
</div>    
@foreach (var item in Model.Avvik.AvviksNotat) {
<div class="gradientBoxesWithOuterShadows">
    <h3>@item.SkrevetAv</h3>    
    @item.SkrevetDato<br />

        <p>@item.Note</p>
    </div>       
}        

Вот мой контроллер

     public ActionResult Details(int? id)
    {
        if (id != null)
        {
            AvviksModel model = new AvviksModel();
            HM_000_EL4Entities entHm = new HM_000_EL4Entities();

            Avvik TheAvvik = ent.Avvik.Where(a => a.AvviksID == id).FirstOrDefault();

            if (TheAvvik != null)
            {                    
                model.Avvik = TheAvvik;
                return View(model);
            }
        }

        return View();

Итак, что я хотел бы сделать, это список «AvviksNotat» внизу. Я хотел бы создать текстовое поле внизу формы сведений, в котором я могу ввести новый комментарий, опубликовать его на сервере и вернуть новый результат в верхней части списка «AvviksNotat». Также было бы круто, используя анимацию.

Answer 1

Я нашел решение по этому вопросу.

@using (Ajax.BeginForm("AddNotat", "Avvik", new AjaxOptions
{
 HttpMethod = "GET",
 InsertionMode = InsertionMode.InsertBefore,
 UpdateTargetId = "notes",
 OnSuccess ="AfterInsert"
}))
{
 <h3>Legg til kommentar</h3>
 <label for="note">Notat</label>     
 <textarea name="notatText" id="notatText" rows="10" cols="30"></textarea>

 <label for="ans">Registert av</label>
 <input type="text"  name="ans" value="@Model.Avvik.RegistrertAvIDAnsNr" />
 <input type="submit" value="Legg til" id="TheAddNoteButton"/>
 @Html.Hidden("id",Model.Avvik.AvviksID)
 }