Wie lösche ich Artikel mit ASP.Net MVC

Question

Was ist der beste Weg, um ein Element in MVC zu löschen? Ich habe eine Liste von Gegenständen. Jede Zeile enthält einen Link "Löschen". Ich möchte, dass der Link Löschen zur Bestätigung auffordert, dann lösche ich das Element aus dem Datenspeicher und aktualisiere die Seite mit den neuen Daten.

Hier ist meine Ansicht Code:

  <%: Ajax.ActionLink(
       "Delete" 
       ,"Delete" 
       , new { id=item.FooId} 
       , new AjaxOptions() 
       { 
        Confirm="Are you sure that you want to delete this item?" 
        , HttpMethod = "post"}) %> 

Und hier ist mein Controller-Code:

[HttpPost] 
    public ActionResult Delete(int id) 
    { 
     try 
     { 
      var success = FooService.Deletefoo(id); 
      return RedirectToAction("Index"); 
     } 
     catch 
     { 
      return View(); 
     } 
    } 

Der Datensatz gelöscht wird, aber die Seite nicht erfrischend ist. Das einzige, was mir einfällt, ist, dass RedirectToAction nur für verschiedene Seiten funktioniert, nicht für die gleiche Seite.

Wie bekomme ich die Seite zu aktualisieren?

Answer 1

Ihre Seite wird nicht aktualisiert, da der AJAX-Aufruf keine 302 berücksichtigt - RedirectToAction() wird verwendet, wenn der gesamte Browser aktualisiert wird. Wenn Sie AJAX für Ihren Link zum Löschen verwenden möchten, sehen Sie sich den gesamten Codebeispiel this post an. Zum Abschluss gibt es ein Javascript window.location.reload(); um die Seite zu aktualisieren. Dies folgt dem PRG pattern.

Ein anderer Ansatz ist die Verwendung von AJAX. Hier ist an example dafür.

Insgesamt ist es gut, mit Ihrem AJAX-Ansatz zu bleiben.

Answer 2

Die andere Möglichkeit ist, das Steuerelement/HTML-Element durch Javascript zu entfernen. Sie können dieses Skript aufrufen, wenn Ihre Ajax-Anfrage abgeschlossen ist.

<%: Ajax.ActionLink(
       "Delete" 
       ,"Delete" 
       , new { id=item.FooId} 
       , new AjaxOptions() 
       { 
        OnSuccess="deleteElement" 
        ,Confirm="Are you sure that you want to delete this item?" 
        , HttpMethod = "post"}) %> 

OnSuccess Option teilt dem Ajax-Helfer die Methode aufzurufen, wenn Ajax-Anfragen erfolgreich abgeschlossen wird.