Discussion :

[mrtechno01]

Salut,

Je suis nouveau ici et je débute dans l'ajax.

Je vous explique mon problème :

J'envoie un formulaire dans un div avec une fonction ajax jusqu'à la rien d'extraordinaire car ca marche, mais dans la page appelée dans le div qui a contrôlé les infos du formulaire, j'ai une inclusion d'un autre page avec une fonction horloge java avec un setTimeout qui doit changer l'heure toute les secondes (normal lol) mais la ca ne fonctionne pas. Par contre quand j'exécute la page seul la fonction se lance bien.

Code de la page principal.php :

Code :

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

1
2
3
4
5
6
7
8
...
<script language="javascript" type="text/javascript" src="fonctions/ajax.js" ></script>
<?
echo"<div id=\"formulaire\" style=\"position:absolute; visibility:visible; width:100%; height:100%; top:0; left:0; z-index:2;\">";
include('formulaire.php');
echo"</div>";
?>
...

Code de la page 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
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
function donnee_get(form1)
{
var data1 = "";
var forma = document.getElementById(form1);
var elements = forma.elements;
for(var i=0; i<forma.length; i++)
{
data1 += elements[i].name + "=" +escape(elements[i].value);
if((i+1)<forma.length)
{
data1+="&";
}
}
return data1;
}
function post_get(fichier, div, method, form)
{
var xhr=null;
var data="null";
if(form!="null")
{
if(method=="GET")
{
data=form;
method="POST";
}
else
{
data = donnee_get(form);
}
}
if (window.XMLHttpRequest)
{
xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open( method, fichier, false);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(data);
if (document.getElementById)
{
document.getElementById(div).innerHTML=xhr.responseText;
}
else
{
if (document.layers)
{
document.div.innerHTML=xhr.responseText;
}
else
{
document.all.div.innerHTML=xhr.responseText;
}
}
}

Code de la page formulaire php :

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
 
<?
if(isset($_POST['login']) && isset($_POST['password']))
{
...
include('horloge.php');
...
}
else
{
...
<form id="formulaire1" name="formulaire1" method="post" action="javascript:post_get('formulaire.php', 'general', 'POST', 'formulaire1');" style="margin:0px; padding:0px;">
...
</form>
...
}
?>

Code de la page horloge.php :

Code :

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

1
2
3
4
5
6
7
<script language="javascript" type="text/javascript" src="fonctions/horloge.js" ></script>
<table width="100%" height="40" border="0" cellspacing="0" cellpadding="0" background="images/structure/barre_haute.png">
  <tr>
    <td id="td_header">&nbsp;</td>
    <td id="horloge" width="100" style="color:#FFFFFF; font-size:18px; font-weight:bold;">&nbsp;</td>
  </tr>
</table>

Code de la page horloge.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
15
16
17
18
19
function horloge(idw)
{
var idvalue=idw;
var today=new Date();
var heuresimple="";
h = today.getHours();
m = today.getMinutes();
s = today.getSeconds();
        if(h<10)
   { h = '0'+h; }
        if(m<10)
   { m = '0'+m; }
        if(s<10)
   { s = '0'+s; }
heuresimple = ''+h+' : '+m+' : '+s+'';
document.getElementById(idvalue).innerHTML = heuresimple;
setTimeout('horloge(\'horloge\')',1000);
}
setTimeout('horloge(\'horloge\')',10);

Donc si quelqu'un aurai une suggestion a mon problème ca serai bien car pour le moment j'ai rien trouvé sur google qui pourrai m'aider.

[E.Bzz]

Bonjour et bienvenue sur Developpez.com

si le script de ton horloge est récupéré est inclus dans la page via Ajax, il est normal qu'il ne soit pas interprété directement.
As-tu le ce point de la FAQ ?

A+

[mrtechno01]

Merci pour ton aide, j'ai trouvé une solution pour le eval() grace a cette page :
http://www.xorax.info/blog/programma...l-global.html#

Du coup mon script ajax.js ressemble a ca :

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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
function donnee_get(form1)
{
var data1 = "";
var forma = document.getElementById(form1);
var elements = forma.elements;
for(var i=0; i<forma.length; i++)
 {
 data1 += elements[i].name + "=" +escape(elements[i].value);
  if((i+1)<forma.length)
  {
  data1+="&";
  }
 }
return data1;
}
function post_get(fichier, div, method, form)
{
var xhr=null;
var data="null";
if(form!="null")
{
if(method=="GET")
{
data=form;
method="POST";
}
else
{
data = donnee_get(form);
}
}
if (window.XMLHttpRequest)
{
xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open( method, fichier, false);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(data);
if (document.getElementById)
{
 var div = document.getElementById(div);
 div.innerHTML = xhr.responseText;
 var allscript = div.getElementsByTagName('script');
 for(var i=0;i< allscript.length;i++){eval(allscript[i].text);}
}
else
{
if (document.layers)
{
 var div = document.div.innerHTML;
 div.innerHTML = xhr.responseText;
 var allscript = div.getElementsByTagName('script');
 for(var i=0;i< allscript.length;i++){eval(allscript[i].text);}
}
else
{
 var div = document.all.div.innerHTML;
 div.innerHTML = xhr.responseText;
 var allscript = div.getElementsByTagName('script');
 for(var i=0;i< allscript.length;i++){eval(allscript[i].text);}
}
}
}

Donc pour le moment pour moi c'est résolu mais que a moitié, car bugg avec IE (on va me dire comme d'habitude d'ailleurs lol)

voici la ligne qui porte probleme : var allscript = div.getElementsByTagName('script');

donc si quelqu'un a une solution pour ie ca serai cool

[E.Bzz]

C'est la même solution
En plus claire dans la FAQ ...
Sinon, tu peux virer les if de la fin il ne servent à rien.
Utilise

Code :

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

var div = document.getElementById(div);

qui fonctionne dans tous les cas ...

EDIT : par contre, il faut remplacer le 2° div ci-dessus par l'id du div.
Une même variable ne peut pas représenter à la fois un id ( = string) et l'objet lui-même (= object)

A+

[mrtechno01]

Merci E.Bzz pour ton aide

j'ai fait le petit changement, dont voici le code :

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
32
33
34
35
36
37
38
<script type="text/javascript">
function donnee_get(form1)
{
var data1 = "";
var forma = document.getElementById(form1);
var elements = forma.elements;
for(var i=0; i<forma.length; i++)
 {
 data1 += elements[i].name + "=" +escape(elements[i].value);
  if((i+1)<forma.length){data1+="&";}
 }
return data1;
}
function post_get(fichier, div, method, form)
{
var xhr=null;
var data="null";
 if(form!="null")
 {
  if(method=="GET")
  {
  data=form;
  method="POST";
  }
  else{data = donnee_get(form);}
 }
 if (window.XMLHttpRequest){xhr = new XMLHttpRequest();}
 else if (window.ActiveXObject){xhr = new ActiveXObject("Microsoft.XMLHTTP");}
xhr.open( method, fichier, false);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(data);
var c = document.getElementById(div);
c.innerHTML = xhr.responseText;
 
var mesScripts = document.getElementById(div).getElementsByTagName("script");
for (var i=0; i<mesScripts.length; i++) {eval(mesScripts[i].innerHTML);}
}
</script>

mais j'ai toujours un problème avec internet explorer qui ne le prend pas en compte cette ligne :

Code :

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

for(var i=0; i<mesScripts.length; i++){eval(mesScripts[i].innerHTML);}

voici l'erreur retourné :

Détails de l’erreur de la page Web

Message*: Cet objet ne gère pas cette propriété ou cette méthode
Ligne*: 36
Caractère*: 42
Code*: 0
URI*: xxxxxxxxxxxx

Si tu avais une idée car la je sèche complet, j'ai fait plein de forum et sans résultat ???

[mrtechno01]

Bon bin j'ai trouvé le problème, en fait c'est que j'avais pas appelé la fonction de mon horloge dans la page principale (j'ai supprimé le include dans ma page formulaire.php) et la youpiiiii. Du coup ca marche maintenant sur tout les navigateurs

[mrtechno01]

Bon je reviens sur mon sujet après un bugg IE que je viens de corriger.

Alors avec ma fonction, il est possible d'appeler un page ou d'envoyer des formulaire en ajax avec des fonctions java-script sans aucun problème sur tous les navigateurs.

Voici le script :

<script type="text/javascript">
function donnee_get(form1)
{
var data1 = "";
var forma = document.getElementById(form1);
var elements = forma.elements;
for(var i=0; i<forma.length; i++)
{
data1 += elements[i].name + "=" +escape(elements[i].value);
if((i+1)<forma.length){data1+="&";}
}
return data1;
}
function post_get(fichier,div,method,form)
{
var xhr=null;
var data="null";
if(form!="null")
{
if(method=="GET")
{
data=form;
method="POST";
}
else{data = donnee_get(form);}
}
if (window.XMLHttpRequest){xhr = new XMLHttpRequest();}
else if (window.ActiveXObject)
{
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;
}
xhr.open( method,fichier,false);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(data);
var c = document.getElementById(div);
c.innerHTML = xhr.responseText;
try
{
var l=c.getElementsByTagName('script').length
for(var j=0;j<l;j++)
{
var script = document.createElement('script');
script.type = 'text/javascript';
script.text = c.getElementsByTagName('script').item(j).text;
document.getElementsByTagName('head')[0].appendChild(script);
}
}
catch(e)
{
alert(e);
}
}
</script>

J'espère que ceci aidera certain

Pour info, pour utiliser cette fonction voici ce qu'il faut faire suivant ce que vous voulez en faire :

Code :

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

1
2
3
4
5
6
7
8
// Appels
post_get("monfichier.php", "div_de_destination", "GET", null)
post_get("monfichier.php", "div_de_destination", "POST", null)
// ces appels permettent d'exécuter le script contenu dans monfichier.php et d'afficher le retour dans la div d'id div_de_destination, ici il n'y a pas de paramètre. Ce sont les appels de base, ils me servent notamment pour faire les liens hypertextes.
post_get("monfichier.php", "div_de_destination", "GET", "c=2&d=4")
// cet appel permet d'exécuter le script contenu dans monfichier.php et d'afficher le retour dans la div d'id div_de_destinatio, les données c=2 et d=4 sont transmises par la méthode POST.
post_get("monfichier.php", "div_de_destination", "POST", "mon_formulaire")
// cet appel permet d'exécuter le script contenu dans monfichier.php et d'afficher le retour dans la div d'id div_de_destinatio, les données du formulaire sont récupérées et mises en forme (également encodées avec la fonction escape, équivalent de l'url_encode de php) par la fonction donnee_get puis sont transmises par la méthode POST.

[Vencarlo]

Bonjour,

Désolé d'ouvrir ce message qui commence à se faire vieux.
Et merci pour ce dernier script, c'est exactement ce que je cherchais !

Alors sous Firefox v3.6 aucun soucis ça fonctionne parfaitement !
Par contre sous IE v7 ça ne fonctionne pas du tout. je n'ai pas d'erreur de compilation mais il ne se passe rien...

Dans mon PHP appelé depuis mon Ajax, j'ai tout simplement ça

Code :

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

echo "<SCRIPT>alert('blablabla');</SCRIPT>";

Quelqu'un à rencontré ce problème ? une idée de correction ?

Merci d'avance.