2017-01-31 4 views
0

Suite à cette article, je suis entrain de charger Partial View via Ajax. Mais il ne charge pas partial view.Asp.net MVC Core - impossible de charger une vue partielle en utilisant Ajax

NOTES:

  1. j'utilise avec VS2015 dernières mises à jour avec l'installation par défaut/configuration de Jquery qui vient avec MVC base application web de modèle de projet de Visual Studio.
  2. L'outil de développement de Google Chrome ne montre aucune erreur. Et la source d'affichage du navigateur affiche toujours la balise <div id="UpdateTabData"></div> vide
  3. J'ai testé en plaçant alert('Test') à l'intérieur de l'événement click dans l'appel Ajax et en utilisant une méthode d'action de contrôleur interne breakpoint que Ajax appelle en effet la méthode TestAction et que la méthode retourne en effet return PartialView("PartialView", myViemodel); sans aucune erreur dans la méthode d'action.
  4. Mais l'Ajax à la fin retourne le mon message d'erreur personnalisé de sa fonction d'erreur

Controller:

[HttpGet] 
public IActionResult TestAction(string calledFrom) 
{ 
    ... some code here with a view model myViemodel 

    return PartialView("myPartialViewName", myViemodel); 
} 

Vue:

@model myProj.Models.myTestViewModel 
...some html here... 
<div id="UpdateTabData"></div> 
... more html here 
... 

code Ajax à la fin de la vue :

$(document).ready(function() { 

    $('#myTabstripID li').click(function() { 
     var li_id = $(this).attr("id"); 

     $.ajax({ 
      url: '@Url.Action("TestAction", "myControllerName")', 
      data: { calledFrom: li_id}, 
      contentType: 'application/json', 
      dataType: 'html' 
      type: 'GET', 
      cache: false, 
      success: function (data) { 
       $('#UpdateTabData').html(data); 
      }, 
      error: function (data) { 
       alert('Error occurred'); 
      } 
     }); 
    }); 

}); 
+2

Ouvrez votre navigateur dev tools -> onglet réseau et consultez la réponse de votre appel ajax. Est-ce 200 OK? Sinon, vérifiez la réponse et voyez ce que vous obtenez. Peut-être que votre code serveur plante – Shyju

+0

@Shyju Oui, l'onglet 'dev tools -> network-> Headers' montre' code d'état: 200 OK' – nam

+0

Que montre le volet d'aperçu dans vos outils de développement? – Detilium

Répondre

0
  1. f12 Appuyez sur et vérifiez l'URL de votre action qui devrait revenir la vue partielle.
  2. Copiez cette URL et collez-la dans la barre d'adresse du navigateur, appuyez sur Entrée.
  3. Vous verrez l'erreur (s'il y a une erreur) ou votre vue partielle.
  4. S'il n'y a pas d'erreur à l'étape 3, essayez de taper alert ($ ('# UpdateTabData'). Length); dans la console (devrait être 1 si vous avez vraiment un élément avec un tel identifiant);

Ceci est une tâche très simple (je veux dire obtenir un résultat d'action qui renvoie une vue partielle), donc cela devrait fonctionner. Il est donc possible que vous ayez juste un faux identifiant ou quelque chose de mineur comme ça quelque part.

0

Vous pouvez supprimer cette partie de votre code. En fonction de votre ActionResult dans le contrôleur, vous retournez une vue partielle. Donc, votre appel ajax attend une vue au lieu de json. Cela va régler votre problème.