Comment mettre à jour un div avec Ajax.BeginForm ET exécuter une fonction javascript?

Question

Je suis mettre à jour un div avec une vue partielle en utilisant quelque chose comme ceci:

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

et son travail bien, la vue retournée s'appened à la div, mais je dois maintenant exécuter un javascript lorsque le poste est réussi, donc j'ai pensé: "facile, il suffit d'ajouter OnSuccess = "MyJsFunc()"" au AjaxOptions, mais après cela, il a cessé de fonctionner! maintenant la page est rafraichie et seule la vue partielle retournée est rendue :(, j'ai même essayé avec un simple Alert("Hi") et son fonctionnement .. comment puis-je faire fonctionner cela?

(par la façon dont je pense que cela peut être un dup de https://stackoverflow.com/questions/1994754/execute-javascript-after-loading-a-mvc-page-using-ajax-beginrouteform mais cette question se sont abandonnés sans réponse)

Answer 1

Une raison de ne pas le faire de la bonne façon (après tout ce que nous sommes en 2010)? Dump MS AJAX où il appartient avec tous les helpers Ajax.* qui en dépendent et écrivent le code approprié. Alors que l'utilisation de MS AJAX dans des formulaires Web classiques aurait pu être justifiée à cause des UpdatePanels, etc ... le faire dans une nouvelle application ASP.NET MVC aujourd'hui, surtout après que Microsoft ait pleinement adopté jQuery, semble être une mauvaise idée.

Ainsi, après la diatribe, voici ma recommandation:

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

puis attacher le gestionnaire soumettre en utilisant discrètement jquery dans un fichier séparé:

$(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; 
    }); 
}); 

ou en utilisant l'excellent jquery form plugin:

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

Avantages de cette approche:

• Unobtrusive
• séparation claire entre les balises et javascript
• fichiers javascript et caching l'utilisation de la bande passante décroissante

avantages Bonus: pas de maux de tête.

Answer 2

Je continué à regarder autour et a trouvé la réponse ici:

Assign a Javascript function to AjaxOptions OnSuccess property raise an error - ASP.NET MVC (avec la réponse qui n'a pas été sélectionné)

Citant Atzu

Si vous devez passer un paramètre à , l'événement OnSuccess que vous pourriez avoir à écrira la fonction de cette manière.

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

et cela a fonctionné pour moi!