投稿し、Jqueryを使用してデータを受信するasp.net mvc 4

Question

私はこれを説明しようとしている複数の投稿を見てきましたが、それらのほとんどはテキストなどを投稿する単なる基本的な例です。 Ajax.BeginFormまたはJqueryを使用して投稿することができるようになりました。私は非常に熟練したjavascript開発者ではない。しかし、誰かが何を使うべきか考えているかもしれません。 [OK]をコードに。

私は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; }   
} 

を必要とするデータはここに私のdetailalsを見るくる成り立つ作成しました：ここ

@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) 
}