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

Je mets à 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 sa fonctionne très bien, le retour de vue est appened à la div, cependant j'ai maintenant besoin d'exécuter un script javascript lorsque le poste est réussi, alors j'ai pensé: "facile, il suffit d'ajouter OnSuccess = "MyJsFunc()"" à la AjaxOptions, mais après cela, il a cessé de travailler! maintenant, la page est rafraîchie et seule la vue partielle est rendu :(, j'ai même essayé avec un simple Alert("Hi") et de ses ni de travail.. comment puis-je obtenir que cela fonctionne?

(je pense que cela peut être une dup de https://stackoverflow.com/questions/1994754/execute-javascript-after-loading-a-mvc-page-using-ajax-beginrouteform mais cette question a été abandonné avec pas de réponse)

+1 sur cette question, je crois que j'ai vu le même comportement avec moi, à l'aide de ASP.NET 4.0 avec MVC2 et C#. Chaque fois que j'ajoute un OnSuccess membre de la valeur à la AjaxOptions, l'Ajax formulaire semble se transformer en une forme régulière. J'ai juste commencé à l'aide de jQuery.formulaire à soumettre de telles formes maintenant, mais j'aimerais comprendre cela, aussi!
Hmm je suis également en utilisant ASP.NET 4 et MVC2 et C#
double possible de Attribuer une fonction Javascript pour AjaxOptions OnSuccess propriété de générer une erreur - ASP.NET MVC

OriginalL'auteur Francisco Noriega | 2010-10-01

  1. 16

    Une raison pour ne pas faire de la bonne façon (après tout, nous sommes en 2010)? Dump MS AJAX où il appartient ainsi que tous les Ajax.* aides qui dépendent de lui et d'écrire un code approprié. Lors de l'utilisation de MS AJAX classique webforms aurait pu être justifiée en raison de la UpdatePanels, etc... à le faire dans un nouveau ASP.NET application MVC aujourd'hui, surtout après Microsoft ont pleinement adhéré à jQuery, semble une mauvaise idée.

    Ainsi, après le coup de gueule, voici ma recommandation:

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

    et fixez ensuite le gestionnaire de soumission discrètement à l'aide de 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 à l'aide de l'excellent jquery forme de plugin:

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

    Avantages de cette approche:

    • Discrète
    • Séparation claire entre le balisage et javascript
    • La mise en cache des fichiers javascript et la diminution de l'utilisation de la bande passante

    Bonus avantage: pas de maux de tête.

    Comment puis-je passer l'id de modèle à la .ajax fonction?
    Masao, vous pouvez l'inclure en tant que champ caché à l'intérieur de la forme.
    Masao, vous pouvez également inclure une option "data" dans les options de bloc transmis à l'ajax option. I. E. $.ajax({..., data:{ id: @Modèle.id }, ...});
    D'une manière ou de l'autre de mon navigateur toujours me demande d'enregistrer le fichier JSON... Pourquoi faut-il faire? Peut-être que si j'avais une indication, il pourrait m'aider à franchir ce cap.
    lequel de ces 2 approches que vous utilisez? Si vous êtes à l'aide de jquery.forme de plugin et votre formulaire contient des fichiers d'entrées et que vous utilisez IE, assurez-vous que vous avez lire la documentation et enveloppé de votre réponse JSON dans <textarea> balises.

    OriginalL'auteur Darin Dimitrov

  2. 5

    J'ai continué à regarder autour et a trouvé la réponse ici:

    Attribuer une fonction Javascript pour AjaxOptions OnSuccess propriété de générer une erreur - ASP.NET MVC (avec la réponse qui n'a pas été sélectionnée)

    Citant Atzu

    Si vous devez passer un paramètre à
    le OnSuccess cas, vous pouvez avoir à
    écrire la fonction de cette façon.

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

    et il a travaillé pour moi!

    OriginalL'auteur Francisco Noriega