récupération variable avec plusieurs appels Javascript

**aikiox** · 23/04/2012, 16h34

Bonjour,
J'ai une page qui fait appelle a deux script Javascript.
Les deux scripts sont pratiquement les mêmes. Le but étant d'afficher deux bouts de page dynamiquement dans la même page. Le seul problème est que je n'arrive pas à récupérer la variable (ID) de la première partie de page chargé sur la deuxième page pour que je puisse effectuer ma requête SQL.

Voici la page en question : http://tiennot.fr/wp/demo.php

Voici le code de la page par défaut :

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
 
<?php
include("./integration/XXXX.php");
?>
<script type="text/javascript" src="./integration/js/ajax-table.js"></script>
<script type="text/javascript" src="./integration/js/ajax-table2.js"></script>
	<header class="entry-header">
		<h1 class="entry-title">Validation Inscription</h1>
	</header><!-- .entry-header -->
 
<select type="text" name="users" onchange="showUser(this.value)">
<option value="">Selectionnez</option>
<?php
connecte();
        $sql = "SELECT * FROM XXX WHERE XXX='1'";
 
        $rs = mysql_query($sql);
        while($row = mysql_fetch_array($rs))
        {
          echo "<option value=\"".$row['idEvenement']."\">".$row['nomEvenement'].' - '.$row['dateEvenement'].' - '.$row['lieuEvenement']."\n  ";
        }
?>
</select>
 
 <form class="cmxform" id="commentForm" method="post" action="./XXX.php">
<fieldset>
<div id="txtHint"><b></b></div>
<div id="txtHint2"><b></b></div>
</fieldset> 
 </form>

Voici le code du script nommé "ajax-table.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
function showUser(str)
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","./integration/getuser.php?q="+str,true);
xmlhttp.send();
}

Voici le code que "ajax-table.js" appelle (getuser.php) avec un GET qui récupère l'ID de la sélection :

Code :

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

1
2
3
4
5
6
7
8
<?
$q = $_GET['q'];
echo "Voici l'ID de la selection : ".$q."<br />";
?>
 
<br /><input  type='radio' onchange='showUser2(this.value)' name='idPack' value='1'>1<br />
<br /><input  type='radio' onchange='showUser2(this.value)' name='idPack' value='2'>2<br />
<br /><input  type='radio' onchange='showUser2(this.value)' name='idPack' value='3'>3<br />

Voici le code du javascript pour la deuxième parti de la page "ajax-table2" :

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
 
function showUser2(str2)
{
if (str2=="")
  {
  document.getElementById("txtHint2").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint2").innerHTML=xmlhttp.responseText;
    }
  }
 
xmlhttp.open("GET","./integration/getuser2.php?s="+str2,true);
xmlhttp.send();
}

Voici le code que "ajax-table2.js" appelle (getuser2.php) avec un GET qui récupère le choix de l'utilisateur (RADIO) mais qui n’arrive pas à récupérer la variable de la première page :

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
<?php
$s=$_GET["s"];
echo "Voici le resultat du radio : ".$s."<br /> ";
 
 
If ($s == "1")
{
echo "requete avec l'ID de la selection faite plus haut que je n'arrive pas a recuperer";
}
else
{
echo "Requete sans l'ID de plus haut...";
}
 
?>
<center>
<input type="submit" value="valider" name="ok">
</center>

Le problème, je pense, est que je devrais utiliser non pas deux script diffèrent mais le fusionner en un. Ensuite, lors de l'appelle de la deuxième page, je devrais rajouter la variable (ID soit str) dans l'URL de destination avec le GET :

xmlhttp.open("GET","./integration/getuser2.php?s="+str2+"$q="+str,true);

Sauf que je n'y arrive pas... Je suis débutant en js et je le manipule très mal...
J'espère avoir été assez claire... Je continu de mon côté...

Cordialement

**wenijah** · 23/04/2012, 16h53

Hello,

Avant tout :

xmlhttp.open("GET","./integration/getuser2.php?s="+str2+"$q="+str,true);

^^ Il faut remplacer le $q par &q.

Le fait d'appeler 2 scripts js externe ne pose aucun problème. Par contre, tu ne déclare str et str2 nullepart.

Essaies ça, en seul fichier javascript:

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
 
var str;
var str2;
function showUser(str)
{
// str = str;
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","./integration/getuser.php?q="+str,true);
xmlhttp.send();
}
 
function showUser2(str2)
{
// str2 = str2;
if (str2=="")
  {
  document.getElementById("txtHint2").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint2").innerHTML=xmlhttp.responseText;
    }
  }
 
xmlhttp.open("GET","./integration/getuser2.php?s="+str2,true);
xmlhttp.send();
}

Si ça ne fonctionne pas, dé-commente str = str et str2 = str2. J'ai pas testé mais en tout c'est un problème de déclaration de tes variables.

Invité · 23/04/2012, 17h00

Bonjour,

Code :

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

1
2
3
4
5
6
7
<?php
$q = $_GET['q'];
echo "Voici l'ID de la selection : ".$q."<br />";
?>
<br /><input  type="radio" onchange="showUser2(this.value,'<?php echo $q; ?>')" name="idPack" value="1">1<br />
<br /><input  type="radio" onchange="showUser2(this.value,'<?php echo $q; ?>')" name="idPack" value="2">2<br />
<br /><input  type="radio" onchange="showUser2(this.value,'<?php echo $q; ?>')" name="idPack" value="3">3<br />

Puis la fonction showUser2() devient :

Code :

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

1
2
3
4
5
function showUser2( str2, id ){
	//...
	xmlhttp.open("GET","./integration/getuser2.php?s="+str2+"&q="+id,true);
	//...
}

ET pour finir getuser2.php :

Code :

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

1
2
3
4
5
6
7
<?php
$s=$_GET["s"];
echo "Voici le resultat du radio : ".$s."<br /> ";
$q = $_GET['q'];
echo "Voici l'ID de la selection : ".$q."<br />";
// [...]
?>

PS : $s, $q, str, str2... tu n'aurais pas des NOMS DE VARIABLES PLUS EXPLICITES à mettre ???
Ça rendrait ton code bien plus intelligible, portable et plus facilement débogable.

**aikiox** · 23/04/2012, 17h38

Bonjour,

MERCI jreaux62 !
Je vais reposter mon code modifié avec des variables plus explicites...

Merci encore !

récupération variable avec plusieurs appels Javascript

JavaScript

Vue hybride

Discussions similaires

Partager

Partager