Come si elimina un elemento utilizzando ASP.Net MVC

Question

Qual è il modo migliore per eliminare un elemento in MVC? Ho una lista di oggetti. Ogni riga conterrà un collegamento "Elimina". Voglio il collegamento Elimina per richiedere conferma, quindi eliminare l'elemento dal datastore e aggiornare la pagina con i nuovi dati.

Ecco il mio codice vista:

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

E qui è il mio codice di controllo:

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

Il disco viene cancellata, ma la pagina non è rinfrescante. L'unica cosa che posso pensare è che RedirectToAction funziona solo per pagine diverse, non la stessa pagina.

Come posso aggiornare la pagina?

Answer 1

La pagina non si aggiorna perché la chiamata AJAX non è in grado di onorare un 302: il RedirectToAction() viene utilizzato quando l'intero browser si sta aggiornando. Se hai intenzione di utilizzare AJAX per il tuo link di eliminazione, dai un'occhiata a this post per tutti i codici di esempio. Completato, esegue una javascript window.location.reload(); per aggiornare la pagina. Questo segue il PRG pattern.

Un altro approccio è l'uso per non utilizzare AJAX. Ecco an example per quello.

In generale, stai benissimo con il tuo approccio AJAX.

Answer 2

L'altro modo è rimuovere quell'elemento di controllo/html tramite javascript. Puoi chiamare questo script quando la richiesta Ajax viene completata.

<%: 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 opzione indica l'helper Ajax per chiamare il metodo quando le richieste Ajax si completa con successo.