SetInterval s'arrête après la demande Ajax

J'utilise Asp.net MVC et je souhaite que mon vue partielle soit rafraîchie sur un intervalle, ce qu'il fait jusqu'à ce que je fasse une requête Ajax non liée, puis il s'arrête.

Voici quelques simulations simplifiées pour illustrer le problème.

Dans AjaxRefresh.js:

function ajaxRefresh() { var f = $("#AjaxForm"); $("#AjaxLoading").show(); $.post(f.attr("action"), f.serialize(), function (context) { $("#AjaxDiv").html(context); $("#AjaxLoading").hide(); }); } setInterval(ajaxRefresh, 1000);

Dans Index.aspx:

 <script type="text/javascript" src="../../Scripts/AjaxRefresh.js"></script> <div id="AjaxDiv"> <% Html.RenderPartial("Computers", Model, ViewData); %> </div>

Et ceci dans Computers.ascx:

 <% Ajax.BeginForm("Index", new { groupName = Model.Name }, new AjaxOptions() { HttpMethod = "Post", LoadingElementId = "AjaxLoading", UpdateTargetId = "AjaxDiv" }, new { id = "AjaxForm" }); Html.EndForm();%> <%= Ajax.ActionLink("Send", "Index", new { groupName = Model.Name, data="blah" }, new AjaxOptions() { HttpMethod="Post", LoadingElementId="AjaxLoading", UpdateTargetId="AjaxDiv" }) %>

Si vous cliquez sur le lien "Envoyer", tout fonctionne toujours, mais la page cesse de se rafraîchir automatiquement. J'ai essayé de m'abonner aux événements ajax, mais Sys.WebForms.PageRequestManager.getInstance () est indéfini.

Je ne sais pas pourquoi cela se produirait, mais j'ai eu des problèmes similaires dans le passé avec jQuery Ajax rafraîchit et setInterval. À la fin, j'ai changé de setTimeout répétitif et je n'ai eu aucun problème:

 function onLoad() { setTimeout(ajaxRefresh, 1000); } function ajaxRefresh() { var f = $("#AjaxForm"); $("#AjaxLoading").show(); $.post(f.attr("action"), f.serialize(), function (context) { $("#AjaxDiv").html(context); $("#AjaxLoading").hide(); }); setTimeout(ajaxRefresh, 1000); }

Je n'utiliserais pas setInterval pour mettre à jour le contenu, comme si le contenu prend plus d'une seconde à charger, vous aurez plusieurs requêtes en file d'attente …

Utilisez setTimeout une fois la demande terminée

 function sendRequest(){ $.ajax({ /** your post data code **/ complete : function(xhr, status){ setTimeout('sendRequest',1000); } }); }

De cette façon, la deuxième requête ne serait pas faite avant la fin de la première. Et cela devrait résoudre votre problème aussi.

Essayez d'ajouter un peu de caractère aléatoire à l'URL où vous postez la requête AJAX. Quelque chose comme $.post(f.attr("action")+"?"+Math.random(), ...) . Je n'ai jamais compris pourquoi cela fonctionne, mais il le fait (parfois). Probablement parce que vous empêchez le navigateur d'utiliser un résultat en cache pour la réponse AJAX.

Quelques questions stupides … avez-vous un débogage de script java activé dans votre navigateur?

J'ai fait le même exemple que vous avez présenté dans mon exemple d'application et cela ne fonctionnait pas avant d'avoir ajouté les scripts suivants à Site.Master:

 <script src="../../Scripts/jquery.js" type="text/javascript" ></script> <script src="../../Scripts/MicrosoftAjax.debug.js" type="text/javascript" ></script> <script src="../../Scripts/MicrosoftMvcAjax.debug.js" type="text/javascript" ></script>

Si cela ne vous aide pas, vérifiez le type de résultats que vous obtenez de la méthode Index lorsque vous cliquez sur Envoyer. Est-ce PartialView ou une vue régulière? Si régulièrement, vous effacez une page entière avec un nettoyeur propre (même sans document).

Si cela ne vous aide pas, voici mon exemple d'application où votre exemple fonctionne (au moins la façon dont je comprends).

http://www.sendspace.com/file/gk2qro

Si votre AjaxRefresh.js a juste le code que vous nous avez montré, vous pouvez utiliser ce code. Lorsque le navigateur appelle le .js, il va commencer à fonctionner.

 var ajax = { init: function() { ajaxRefresh(); setTimeout(init, 1000); } ajaxRefresh: function() { var f = $("#AjaxForm"); $("#AjaxLoading").show(); $.post(f.attr("action"), f.serialize(), function (context) { $("#AjaxDiv").html(context); $("#AjaxLoading").hide(); }); } } ajax.init();

Enrouler ajaxRefresh dans une fonction anonyme et l'appeler avec des parenthèses fonctionne pour moi. Donc, votre deuxième dernière ligne de code serait comme setInterval(function () { ajaxRefresh() }, 1000) .

Je ne le comprend pas non plus.