Rafraichir un div (ou contentPane ?)

Version imprimable

Bonjour à tous,
J'ai un div que j'aimerais rafraichir mais je ne sais pas comment faire.

Je l'ai passé en dijit.layout.ContentPane, et j'ai créé un bouton appelant une fonction JS (Dojo) pour le rafraichir. Mais problème, je remarque que c'est l'ensemble de la page qui est ré affiché dans le div que je viens de rafraichir, et non juste son contenu initial ...
Comment faire?

Mon code :
Code:

1 2 3 4 5 6 7 8 9 10 function refreshDiv(){ var toto = dijit.byId("div3"); var foo = toto.refresh(); } // D'autres div... <div data-dojo-type="dijit.layout.ContentPane" id="div3" style="border: 1px green solid;"> un message </div>

03/11/2011, 06h45
cfried

cherche du coté de dojo.xhrGet ensuite sur le onLoad(content) tu supprimes et recrée ta ContentPane avec ton nouveau content ça devrait marcher
03/11/2011, 13h49
VinceCBA

Bonjour,
pourrais tu etre un peu plus précis sur la réalisation de ce que tu proposes stp ?
Merci

Salut,

Je viens de te donner le mode opératoire.

Dans ta fonction refreshDiv() tu fais :

Code:

1
2
3
4
5
6
7
8
9
 
xhrGet({
url:"monPhpQuiMeDonneLeContent.php",
onLoad:function(content){
// ici tu fais un dijit.byId('div3').domNode.innerHTML=content
// si ça ne marche pas tu fais un truc du genre destroyRecursive(true) sur ton ContentPane (le booléen te permet de conserver le domNode) et tu recrées ton ContentPane sur celui ci
},
onError://ta fonction de traitement
});

Il faut essayer et réessayer encore. L'API Dojo est ton amie ;)

03/11/2011, 15h57
VinceCBA
En fait mon problème est que je ne voudrais pas passer par l'insertion d'un fichier externe (ton "url'), et ne pas "remplacer" le contenu de mon contentPane (via un innerHTML) .. Ouais je sais j'en demande beaucoup :aie:

Je ne sais pas si tu connais struts2, mais j'ai par exemple ceci :
Code:

1 2 3 <s:div data-dojo-type="dijit.layout.ContentPane"> <s:property value="variableJava" /> </s:div>
Avec par exemple, au 1er chargement de ma page : variableJava = "toto"
Puis j'appuie sur un bouton qui va faire les actions suivantes :
- Modifier la valeur de "variableJava" en "tutu" (dans ma classe Java), via une Action Struts
- Faire un refresh de mon contentPane (ou un div si on peut le faire avec) => le contenu "pur" (j'entends par la, le code) ne changera pas, mais la partie interprétée, coté client, affichera "tutu" au lieu de "toto".

Je ne sais pas si c'est assez clair comme explication
04/11/2011, 06h20
cfried

Si je comprends bien tu veux que le serveur envoie une mise à jour au client spontanément ? De ce que je connais ce n'est pas encore possible mais ça va le devenir avec les socket HTML5 ...
04/11/2011, 14h01
VinceCBA

Citation:

Envoyé par cfried

Si je comprends bien tu veux que le serveur envoie une mise à jour au client spontanément ? De ce que je connais ce n'est pas encore possible mais ça va le devenir avec les socket HTML5 ...

Non, pour faire simple, je voudrais simplement que mon contentpane se rafraichisse, en gardant le même contenu (donc sans avoir l'ensemble de la page qui se rajoute dedans), et sans utiliser de "href" si possible

Citation:

Envoyé par cfried

cherche du coté de dojo.xhrGet ensuite sur le onLoad(content) tu supprimes et recrée ta ContentPane avec ton nouveau content ça devrait marcher

J'ai finalement réussi, en utilisant un peu ce principe.
J'ai une jsp principale (index.jsp) dans laquelle je vais inclure mes jsp "filles" en ajax. Et donc si je veux actualiser l'une d'entre elle, je détruits tous les widgets qu'elle contient :

Code:

1
2
3
4
5
function destroyWidgets(div){
    dojo.forEach(dijit.findWidgets(dojo.byId(div)), function(w) {
        w.destroyRecursive();
    });
}

Puis je charge ma page via XHRget:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
function populateDiv(method, url, handleAs, divId, contentId, isHtmlReturned){
dojo.xhr(method,{
            url: url, 
            handleAs : handleAs,
            preventCache: true,
            content:{Id:contentId},
            timeout: 20000,
            load: function(newContent) {
                dojo.byId(divId).innerHTML = newContent;
                dojo.parser.parse(divId); // Permet de garder Dojo
            },
            error: function(response, args) {
                var errNum = args.xhr.status; // On récupère le numéro d'erreur
                dojo.byId(divId).innerHTML=response;
 
                switch (errNum) {
                    case 404:
                        message = "The requested page was not found";
                        break;
                    case 500:
                        message = "The server reported an error.";
                        break;
                    case 407:
                        message = "You need to authenticate with a proxy.";
                        break;
                    default:
                        message = "Unknown error. : ";
                }
            }
        },isHtmlReturned);
}

Et le tour est joué :)

10/11/2011, 08h15
cfried

Oui je pense que c'était le plus évident :aie: bien joué