3
votes

MVC5 Ajax.ActionLink charge une nouvelle page au lieu de la remplacer

Je sais que des questions similaires ont été posées et répondues à plusieurs reprises; pour la vie de moi, je ne peux pas déterminer ce qui me manque, veuillez rester avec moi.

J'essaie de charger une vue partielle avec un éditeur pour un élément de la page, et d'afficher cet éditeur en tant que Bootstrap modal, mais il se charge toujours sur une nouvelle page.

_Layout.cshtml fait référence au bundle jQuery:

<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />

`BundleConfig .RegisterBundles () ajoute jQuery et ajax discret:

public ActionResult GetEditor(string id) => Content("Success");

Le dossier Scripts contient les deux fichiers:

La Vue a un div vide avec le bon id à recevoir le contenu

function showEditor() { $("#editor").modal("show"); };

J'ai construit le ActionLink ainsi:

@Ajax.ActionLink(linkText: "Edit",
    actionName: "GetEditor",
    routeValues: new {id = Model.Id},
    ajaxOptions: new AjaxOptions
    {
        OnSuccess = "showEditor",
        UpdateTargetId = "editor",
        InsertionMode = InsertionMode.Replace,
        HttpMethod = "POST"
    })

Ma fonction JS vient de montre le modal:

<div id="editor"></div>

... et juste pour voir si je peux le faire fonctionner, je renvoie une simple chaîne de mon Contro ller:

bundles.Add(new ScriptBundle("~/bundles/jquery")
    .Include("~/Scripts/jquery-{version}.min.js") // <-- must come first
    .Include("~/Scripts/jquery.unobtrusive-ajax.min"));

Edit 1

Dans mon web.config, j'ai activé à la fois la validation côté client et les js discrets:

@Scripts.Render("~/bundles/jquery")

Edit 2

J'ai essayé d'actualiser sans utiliser le cache ( Ctrl + F5 ) avec le même résultat, et les outils de développement ne montrent aucune erreur JavaScript . J'obtiens les mêmes résultats sur tous les navigateurs.

Qu'est-ce que j'oublie?

javascript jquery asp.net-mvc-5 actionlink html.actionlink

0 commentaires

3 Réponses :

0
votes

Essayez d'utiliser

Ctrl + F5

Pour actualiser votre page et réessayer.

Pour Chrome, vous pouvez mettre en cache vos ressources groupées.

Appuyez sur F12 et voyez s'il existe une erreur JavaScript et corrigez-la le cas échéant.

Essayez de renvoyer une PartialView comme résultat de votre action C #.

1 commentaires

L'actualisation de Ctrl + F5 n'a pas aidé, et il n'y a aucune erreur dans les outils de développement. D'autres suggestions?

0
votes

L'avez-vous activé dans le web.config?

HtmlHelper.UnobtrusiveJavaScriptEnabled = true;

EDIT: Ou l'avez-vous activé via HTML Helper

<configuration>
    <appSettings>
        <add key="UnobtrusiveJavaScriptEnabled" value="true"/>
    </appSettings>
</configuration>

1 commentaires

Oui, merci de me rappeler de vérifier cela; Je l'ai ajouté à la question.

3
votes

Il s'avère que je ne suis qu'un idiot:

J'ai essayé d'ajouter manuellement la bibliothèque de validation discrète:

bundles.Add(new ScriptBundle("~/bundles/jquery")
  .Include("~/Scripts/jquery-{version}.min.js") 
  .Include("~/Scripts/jquery.unobtrusive-ajax.min"));  // <--- what's missing?

... et cela a commencé à fonctionner. J'ai alors pensé que quelque chose n'allait pas avec le regroupement - même si j'ai fait très attention de garder les bibliothèques dans le bon ordre ....

<script src="~/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>

Il s'avère que complet les noms des fichiers javascript sont obligatoires .

0 commentaires