Discussion :

[brazilia28]

Bonjour à tous,

Je met à jour un div en ajax lorsque je clique sur un bouton.
Cela fonctionne bien lorsque je n'affiche que du code XHTML.
Mais si je met du code javascript dans ce contenu, il ne s'exécute pas.

Voici un exemple :

Mon bouton, rien de bien compliqué :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
 
<input type="button" value="envoyer" onclick="test();"/> 
<div id="data"></div>

Ma fonction "test()" :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 getXhr(){
         var xhr = null;
         if(window.XMLHttpRequest) // Firefox et autres
         xhr = new XMLHttpRequest();
         else if(window.ActiveXObject){ // Internet Explorer
           try {
                      xhr = new ActiveXObject("Msxml2.XMLHTTP");
                  } catch (e) {
                      xhr = new ActiveXObject("Microsoft.XMLHTTP");
                  }
        }
        else { 
           alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
           xhr = false; 
        } 
        return xhr;
}
 
function test(){
        var xhr = getXhr()
 
        xhr.onreadystatechange = function(){
 
          if(xhr.readyState == 4 && xhr.status == 200){
            document.getElementById("data").innerHTML = xhr.responseText;
          }
        }
        xhr.open("GET","test.php",true);
        xhr.send(null);
}

Et voici le contenu de mon fichier "test.php" :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
 
<?php echo "Bonjour"; ?>

Ici, "Bonjour s'affiche bien

Mais si le contenu est celui-ci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<script type="text/javascript">document.write("Bonjour" );</script>

Rien ne s'affiche, donc j'en déduis que les appels de Javascript ne fonctionnent pas.

Avez-vous une idée ?

Je vous remercie

[E.Bzz]

Bonjour,

Rien ne s'affiche, donc j'en déduis que les appels de Javascript ne fonctionnent pas.

Pas de cette manière, effectivement (modifier un innerHTML n'exécute pas le code).
Il faut que tu utilises

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
if(xhr.readyState == 4 && xhr.status == 200){
eval(xhr.responseText);
}

Mais au lieu d'un document.write(), il faudra que ton PHP te retournes la chaine

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

"document.getElementById('data').innerHTML = 'Bonjour';"

Pour info : certains déconseillent l'utilisation du eval()

A+

[brazilia28]

Merci pour cette piste.

J'essaie d'affichier un panneau Accordeon avec le framework Spry de Dreamweaver CS3.
J'ai modifié mon code comme ceci, mais malheureusement, il fonctionne seulement avec Firefox. Sous IE, j'ai une erreur de syntaxe.

Voici mon code :

index.html

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
<td width="25%"><h3 onmouseover="this.style.backgroundColor='#ff4532';" onmouseout="this.style.backgroundColor='#ffffff';" onclick="moncv();">mon CV</h3></td>
<div id="data"></div>

ajax.js

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
function moncv(){
        var xhr = getXhr()
        // On défini ce qu'on va faire quand on aura la réponse
        xhr.onreadystatechange = function(){
          // On ne fait quelque chose que si on a tout reçu et que le serveur est ok
          if(xhr.readyState == 4 && xhr.status == 200){
            document.getElementById("data").innerHTML = eval(xhr.responseText);
			eval("var Accordion1 = new Spry.Widget.Accordion('Accordion1')");
          }
        }
        xhr.open("GET","moncv.php",true);
        xhr.send(null);
}

moncv.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<?php
echo "<div id='Accordion1' class='Accordion' tabindex='0'>";
echo "<div class='AccordionPanel'>";
echo "<div class='AccordionPanelTab'>Etiquette 1</div>";
echo "<div class='AccordionPanelContent'>Contenu 1</div>";
echo "</div>";
echo "<div class='AccordionPanel'>";
echo "<div class='AccordionPanelTab'>Etiquette 2</div>";
echo "<div class='AccordionPanelContent'>Contenu 2</div>";
echo "</div>";
echo "</div>";
?>

Savez-vous pourquoi IE me renvoie une erreur ?

Merci beaucoup

[E.Bzz]

Savez-vous pourquoi IE me renvoie une erreur ?

Parce que to PHP ne te renvoie plus un code JS (ce qui était l'objet de ta question, si je ne m'abuse), mais HTML.
eval() c'est pour une instruction JS.
Pour du code HTML, il faut rester sur ton innerHTML du début (et du coup, la question ne se justifiait pas) ...

A+

[brazilia28]

Oh super ça marche nickel.

Merci beaucoup de ton aide.