Quelle est la bonne façon de mettre à jour tous les éléments d'une page rendue via AJAX?

Question

J'ai une page compliquée étant rendu par PHP et que vous souhaitez conserver tous les éléments de la page à jour de temps via AJAX vote. Y at-il une sorte de façon générale / intelligent pour concevoir une infrastructure pour soutenir sans avoir à spécifier manuellement chaque élément à mettre à jour? À la recherche d'idées. Merci!

Answer 1

En utilisant jQuery, j'enverrais une liste séparée par des virgules des sélecteurs jQuery pour mettre à jour sur le serveur. Le serveur répondra en fin de compte en lisant ces sélecteurs et produire le code HTML pour remplir les éléments correspondant aux sélecteurs:

$.get("/updater", { elementsToUpdate: "#someDiv,#someTable,#someOtherElement"}, function(json) {
      $.each(json, function(k, v) {

        // the key is the selector, the value is the 
        // HTML to set to that (or those) element(s):
        $(k).html(v);
      });    
}, "json"); // we are expecting the server to return JSON

Le serveur répondra en envoyant JSON au client avec la structure suivante:

 {"#someDiv":"this is some HTML to fill up div with ID someDiv","#someOtherElement":"here is some more HTML","#someTable":"here is some more HTML"}

Answer 2

peut-être ajouter une classe spéciale à tous les éléments à jour via ajax, et vous pouvez également encoder des données supplémentaires dans certains autres attributs par exemple

<a class="ajaxUpdate" data="{'a':'json or whatever', 'put whatever here':'ok'}">test</a>

puis avec jquery, vous pouvez facilement retirer ces données et eval, et l'utiliser dans votre ajax

Answer 3

Vous pouvez interroger une page qui vous renvoie la structure codée JSON de votre page, comme:

var page = {
    'elem1': {
        'html': '<div>... ',
        'update': True
    },
    'elen2': {
        'update': False

et ainsi de suite, puis mettre à jour ce qui est nécessaire, ayant un seul sondage.

Answer 4

Gardez votre structure de pages d'éléments comme des données privées et ont les éléments publics pour les mettre à jour

var page = (function(){
    var private_data = {
    //json
    };

    return {
        workOnData : function(){//process the data}

    }
})()

Ceci est une bonne façon, vous pouvez garder vos données pages en toute sécurité et en douceur.

Answer 5

J'utilise jQuery pour le faire si je vous étais o: alors vous pourriez faire quelque chose comme ...

$('div.updateThisClass').css('color','#fff')