MS MVC Formular AJAXifying Techniken

Question

Ich bin auf der Suche nach elegant Weg, meine Formulare (mit jQuery) zu ajaxifizieren.
Wie machst du das?

Answer 1

Hier ist meine Lösung (ich glaube, es ist eine Progressive enhancement Lösung), nur mit jQuery ohne Plugins:

var form = $('form#YourFormId'); 
$(':submit', form).click(function (event) { 
    event.preventDefault(); 
    $.post(form.attr('action'), form.serialize(), 
     function(data, status) { 
      if(status == 'success') { 
       // your code here 
      } 
     } 
    ); 
}); 

AKTUALISIERT:

Wenn Ihre POST-Antwort "HTML mit Form" ist dann versuchen Sie dies:

function ajaxifyForm(form) { 
    $(':submit', form).click(function (event) { 
     event.preventDefault(); 
     $.post(form.attr('action'), form.serialize(), 
      function(data, status) { 
       if(status == 'success') { 
        var newForm = $(data); 
        ajaxifyForm(newForm); 
        form.after(newForm).remove(); 
       } 
      } 
     ); 
    }); 
} 

Answer 2

Kasse JQuery plugins storage Ich bin sicher, es werden Sie feststellen, dass Sie

Answer 3

Ajaxify Ihre Formulare müssen ... das ist ziemlich vage.

Wenn Sie ein Formular asynchron übermitteln möchten, können Sie $ .post() verwenden, um eine separate Controller-Aktion zu senden.

Beispiel:

Nach Ansicht:

$.post('<%= Url.Action("DoAjaxCall") %>', $('form').serialize(), 
function (data) { 
    alert(data.Message); 
} 
, "json"); 

In Ihrem Controller:

public ActionResult DoAjaxCall(YourModel model) 
{ 
    return Json(new { Message = "Your ajax call is working!" }); 
} 

Das ist, was ich in einigen meiner Formen zumindest bin mit.

P.S .: Ich schrieb dies in den Stackover-Text-Editor, so dass es nicht wirklich getestet wird. Aber als Umriss sollte es funktionieren.