Kann nicht auf Aktionsmethode von JQuery zugreifen, wenn [AntiForgeryToken] aktiviert ist

Question

Ich habe eine JQuery-Funktion, die funktioniert, aber wenn ich [AntiForgerToken] für die Aktionsmethode aktivieren, kann die JQuery-Funktion nicht auf die Aktionsmethode zugreifen andere Schnipsel, wo ich AntiForgeryToken aktiviert:

@using (Html.BeginForm("InsertStudent","Students",FormMethod.Post, new { @id="myform"})) 
{ 
    @Html.AntiForgeryToken() 

Es spielt keine Rolle, ob die @Html.AntiForgeryToken() innerhalb der Ansicht aktiviert ist oder nicht, die JQuery-Funktion funktioniert gut, das man mit dem Problem ist bei der Aktion Methode ...

Warum passiert das? Was ich vermisse? Ich habe gelesen, ist sehr wichtig für die Sicherheit zu [AntiForgeryToken] auf die Post-Aktion Methoden aktiviert haben, so denke ich, dass die Anwendung mit es aktiviert in beiden Orten die Aktionsmethode und die Ansicht funktionieren sollte.

JQuery-Funktion:

function InsertShowStudents() { 
    var counter = 0; 
    $.ajax({   
     type:"post", 
     url: "/Students/InsertStudent/", 
     data: { Name: $("#Name").val(), LastName: $("#LastName").val(), Age: $("#Age").val() } 
    }).done(function (result) { 
     if (counter==0) { 
     GetStudents(); 
     CounterStudents(); 
      counter = 1; 
     } 
     else { 
      $("#tableJQuery").append("<tr>"+"<td>"+result.Name+"</td>"+"<td>"+result.LastName+"</td>"+"<td>"+result.Age+"</td>"+"</tr>") 
     } 
     //clear the form 
     $("#myform")[0].reset(); 
    }).error(function() { 
     $("#divGetStudents").html("An error occurred") 
    }) 
} 

Aktionsmethode:

[HttpPost] 
     [ValidateAntiForgeryToken] 
     public ActionResult InsertStudent(Student student) 
     { 
      if (ModelState.IsValid) 
      { 
       db.Students.Add(student); 
       db.SaveChanges(); 
       //ModelState.Clear(); 
       return RedirectToAction("InsertStudent"); 
      } 
      return View(student); 
     } 

Spalten der Tabelle:

@foreach (var item in Model) { 
    <tr> 
     <td> 
      @Html.DisplayFor(modelItem => item.Name) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.LastName) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.Age) 
     </td> 
     @* <td style="display:none" class="tdStudentID">@Html.DisplayFor(modelItem => item.StudentID)</td> *@ 
     <td> 
      <img src="~/images/deleteIcon.png" width="20" height="20" class="imgJQuery" data-id="@item.StudentID" /> 
     </td> 
     <td> 
      @Html.ActionLink("Details","Details", new { id=item.StudentID}) 
     </td> 
    </tr> 
} 

Answer 1

Sie nicht den Wert des Tokens in Ihrem Ajax-Aufruf vorbei so ein Ausnahme wird ausgelöst. Sie können den Wert des Tokens erhalten

var token = $('[name=__RequestVerificationToken]').val(); 

verwenden und Ihre Ajax-Aufruf modifizieren

data: { __RequestVerificationToken: token, Name: $("#Name").val(), LastName: $("#LastName").val(), Age: $("#Age").val() } 

jedoch mit einzubeziehen, ist es einfacher, nur das Formular serialisiert, die das Token

umfassen wird

$.ajax({   
    type:"post", 
    url: '@Url.Action("InsertStudent", "Students")', // don't hardcode your url's 
    data: $('#myform').serialize(), 
}).done(function (result) { 

Seitennotiz: Ajax Anrufe nie umleiten (der ganze Punkt von Ajax ist es, auf der gleichen Seite zu bleiben) so return RedirectToAction("InsertStudent"); in Ihrem InsertStudent() wird nicht funktionieren. Darüber hinaus wird Ihre Rückkehr HTML, so dass die $("#tableJQuery").append() Code in der .done() Rückruf wird fehlschlagen.

Es scheint, Sie haben ein Formular, eine neue Student so Ihre Methode einfach hinzufügen müssen einen JsonResult angibt, Erfolg oder Misserfolg zurückzukehren, und dann erfolgreich, wenn, dann können Sie eine neue Zeile in Ihre Tabelle in Form basierend auf den Werten hinzufügen B.

}).done(function (result) { 
    if (result) { 
     var row = $('<tr></tr>'); 
     row.append($('<td></td>').text($("#Name").val())); 
     ... // add other cells 
     $("#tableJQuery").append(row); 
     //clear the form 
     $("#myform")[0].reset(); 
    } else { 
     // Oops something went wrong 
    } 
})