Wie aktualisiert man ein div mit Ajax.BeginForm UND führt eine JavaScript-Funktion aus?

Question

Ich bin ein div mit einer Teilansicht der Aktualisierung durch so etwas wie dies mit:

<% using (Ajax.BeginForm("Action", "Controller", 
       new { id=Model.id }, 
       new AjaxOptions 
       { 
        UpdateTargetId = "divId", 
        InsertionMode = InsertionMode.InsertAfter, 
       })) 
    { %> 

und seine adaequat, die zurück Blick auf das div wird appened, aber ich muss jetzt eine Javascript auszuführen, wenn der Beitrag ist erfolgreich, also dachte ich: "einfach, fügen Sie einfach OnSuccess = "MyJsFunc()"" zu der AjaxOptions hinzu, aber nachdem dies getan wurde, hörte es auf zu arbeiten! Jetzt wird die Seite aktualisiert und nur die zurückgegebene Teilansicht gerendert :(, habe ich sogar mit einem einfachen Alert("Hi") versucht und es funktioniert noch nicht .. wie kann ich das zum laufen bringen?

(nebenbei denke ich, dass das sein kann ein dup von https://stackoverflow.com/questions/1994754/execute-javascript-after-loading-a-mvc-page-using-ajax-beginrouteform bekam aber diese Frage ohne Antwort aufgegeben)

Answer 1

Irgendein Grund dafür, es nicht richtig zu machen (immerhin sind wir 2010)? Dump MS AJAX, wo es zusammen mit allen Ajax.* Helfer, die davon abhängen und schreiben richtigen Code. Während die Verwendung von MS AJAX in klassischen Webforms aufgrund der UpdatePanels gerechtfertigt sein könnte, scheint es heute eine schlechte Idee zu sein, dies in einer neuen ASP.NET MVC-Anwendung zu tun, insbesondere nachdem Microsoft jQuery vollständig angenommen hat.

So nach dem rant hier ist meine Empfehlung:

<% using (Html.BeginForm("Action", "Controller", new { id = Model.id }) { %> 

und dann fügen Sie die einreichen Handler unaufdringlich jquery in einer separaten Datei mit:

$(function() { 
    $('form').submit(function() { 
     $.ajax({ 
      url: this.action, 
      type: this.method, 
      success: function(result) { 
       // feel free to execute any code 
       // in the success callback 
       $('#result').html(result); 
      } 
     }); 
     return false; 
    }); 
}); 

oder mit dem ausgezeichneten jquery form plugin:

$(function() { 
    $('form').ajaxForm(function(result) { 
     // feel free to execute any code 
     // in the success callback 
     $('#result').html(result); 
    }); 
}); 

Vorteile dieses Ansatzes:

• Unauffällig
• Klare Trennung zwischen Markup und JavaScript
• Caching-JavaScript-Dateien und verringert die Bandbreitennutzung

Bonus profitieren: keine Kopfschmerzen.

Answer 2

ich hielt sich umsah und die Antwort hier:

Assign a Javascript function to AjaxOptions OnSuccess property raise an error - ASP.NET MVC (mit der Antwort, die nicht ausgewählt) wurde

Zitiert Atzu

Wenn Sie irgendeinen Parameter an das OnSuccess-Ereignis übergeben müssen, müssen Sie die Funktion auf diese Weise schreiben.

OnSuccess = "function(){exampleFunction('" + param1 + "');} 

und es funktionierte für mich!