MVC 5 Auto rafraîchissante vue partielle
J'ai une vue partielle qui est affiché dans le Pied de page du site dans _Layout. Le contrôleur calcule une valeur à chaque seconde - le nombre de victimes de la criminalité informatique.
Contrôleur De Code:
namespace EUWebRole.Controllers
{
public partial class PartialFooterStatisticsController : Controller
{
[OutputCache(NoStore = true, Location = OutputCacheLocation.Client, Duration = 1)]
public ActionResult Index()
{
//14 victims per second.
//what second is it
int hrs = DateTime.Now.Hour;
int min = DateTime.Now.Minute;
int sec = DateTime.Now.Second;
int totalSeconds = sec + (min * 60) + (hrs * 3600);
int totalVictims = totalSeconds * 14;
ViewData["TotalVictims"] = totalVictims.ToString("N0");
return PartialView("_PartialFooterStatistics");
}
}
}
La vue Partielle ressemble à ça - pas de mise en forme ou à quelque chose, je veux juste la valeur pour l'instant 😛
@ViewData["TotalVictims"]
Enfin, la _Layout section pour c'est ici:
@Html.Partial("_PartialFooterStatistics")
Comment puis-je obtenir la valeur à afficher dans _Layout et mise à jour chaque seconde sans actualiser la page entière - je suppose que c'est ce que la vue Partielle permettra d'éviter, mais pas sûr.
Désolé pour une question aussi simple, mais nous avons tous commencer quelque part.
Grâce
Mise à JOUR de 1
Ok, je suis un peu plus à l'avant maintenant.
Le GetVictimCount est appelé qu'une seule fois.
Voici mon code de Contrôleur:
public partial class PartialFooterStatisticsController : Controller
{
public ActionResult Index()
{
return PartialView("_PartialFooterStatistics");
}
public JsonResult GetVictimCount()
{
int hrs = DateTime.Now.Hour;
int min = DateTime.Now.Minute;
int sec = DateTime.Now.Second;
int totalSeconds = sec + (min * 60) + (hrs * 3600);
int totalVictims = totalSeconds * 14;
//logic here for getting your count
var victimCount = totalVictims;
return Json(victimCount, JsonRequestBehavior.AllowGet);
}
}
Ma Vue Partielle code:
<script src="~/Scripts/jquery-1.10.2.js"></script>
<div id="victimCountId">
Result
</div>
<script type="text/javascript">
var timeoutId;
$(document).ready(function () {
timeoutId = window.setTimeout(UpdateCount, 1000);
});
function UpdateCount() {
$.getJSON("PartialFooterStatistics/GetVictimCount", function (dataResponse) {
var div = $('#victimCountId').html(dataResponse);
printResult(div, item);
});
}
function printResult(div, item) {
div.append("Result " + item.Line1);
}
</script>
et mon _Layout Code
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
@Html.Partial("_PartialFooterStatistics")
</footer>
</div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
</body>
</html>
<script type="text/javascript">
$(function () {
setInterval(function () { $('#_PartialFooterStatistics').load('GetVictimStatistics'); }, 1000); //every 3 sec
});
</script>
function printResult(div, item) {
div.append("Result " + item.Line1);
}
</script>
Comme le dit la vue Partielle n'est pas remise à chaque seconde, et la sortie n'est pas droit non plus... je m'attends à ce "Résultat" et un nombre formaté comme les 100 000 qui il est dans le contrôleur, mais plutôt tout ce que j'obtiens est 100000.
N'a même pas d'afficher le contenu de la ViewBag.
Je suis confus avec votre configuration, Im assez. Nouveau pour MVC ainsi, mais je ne crois pas que la création de contrôleur pour des vues partielles de sens. Ce que l'URL que vous utilisez pour tester votre page... Pouvez-vous vérifier votre méthode d'action est jamais appelée?
La maison de l'indice est utilisé comme la vue partielle est calculée en pied de page.
OriginalL'auteur Dave Gordon | 2014-05-31
Vous devez vous connecter pour publier un commentaire.
Comme Jeremy Ouest dit dans les commentaires...vous aurez besoin d'utiliser javascript pour faire cela.
Votre MVC contrôleur de l'action est sur le serveur, donc qui ne fonctionne que lorsque l'on demande à cette action.
Vous pouvez le faire avec du javascript (Vous envoyez une requête en arrière-plan).
Donc une solution qui peut fonctionner pour vous, c'est de faire une action qui renvoie certains JSON. Une action pourrait ressembler à ceci.
Alors, maintenant que vous avez votre logique pour l'obtention de votre compte qui continue de mettre à jour, vous pouvez simplement appeler cela à volonté avec du javascript. À l'aide de jquery une solution ressemblerait à quelque chose comme
Alors puisque vous voulez cette course à chaque seconde, vous pouvez utiliser de la fenêtre.setTimeout
Donc, avec cette solution, vous pourrez envoyer des requêtes au serveur à chaque seconde. Je ne sais pas exactement ce que vous faites sur le serveur, ou si elle doit être, mais Si vous pouvez déplacer cette solution ensemble pour javascript, qui serait plus rapide et probablement mieux que votre serveur n'aurait pas à supporter autant de demandes.
Encore une fois, c'est juste une façon d'obtenir le comportement que vous êtes après.
Je convertis le tout pour un Jscript ajouté ça à _Layout et il fonctionne. J'ai enlevé le contrôleur et la vue partielle. Q) si j'ai fait de cette manière ou en quelque sorte fait le JScript dans la vue partielle?
Il dépend. Mettre le javascript sur les principaux _Layout page est très bien, mais se rendent compte que _Layout est sur chaque page de votre site web. Si c'est quelque chose qui n'est pertinent que sur une page, il doit probablement être mis dans une vue ou quelque chose, de sorte que vous n'êtes pas en cours d'exécution que javascript quand il n'est pas nécessaire
De bons conseils, je vais faire ça aujourd'hui.
OriginalL'auteur Kyle Gobel