Liste déroulante+AJAX+fichier xml
warui
-
avion-f16 Messages postés 20368 Date d'inscription Statut Contributeur Dernière intervention -
avion-f16 Messages postés 20368 Date d'inscription Statut Contributeur Dernière intervention -
Bonsoir messieurs! j'ai un problème un peu compliqué pour un débudant comme moi
j'ai une liste déroulante "produit" qui est liée à une bd Mysql via PHP
j'aimerai pas surcharger ma bd avec les données, et j'aimerai quand la liste affiche le nom d'un produit "X", une requete "XMLHTTPrequest" permettera de lister en bas la fiche technique du produit à partir d'un fichier XML
la liste est correctement liée à la table correspondante, le problème est au niveau du "onchange :", qui empeche le résultat de la requette JS de s'afficher en bas
merci d'avance pour votre assistance!
voilà mon code (index.php+responsexml.js+responsexml.php+pd_catalog.xml)
index.php
----------------------------------------
............................
<head>
<script type="text/javascript" src="responsexml.js"></script>
<title>catalogue</title>
</head>
...............................
* Cération de la requête pour avoir la liste des produits */
$sql3 = "SELECT `idpd`, `nompd`".
" FROM `produit`".
" WHERE `idtype` = ". $idr2 ."".
" ORDER BY `idpd`;";
if($connexion != false)
{
$rech_pd = mysql_query($sql3, $connexion);
/* Un petit compteur pour les départements */
$nd1 = 0;
/* On crée deux tableaux pour les numéros et les noms des produits */
$code_pd = array();
$nom_pd = array();
/* On va mettre les numéros et noms des produits dans les deux tableaux */
while($ligne_pd = mysql_fetch_assoc($rech_pd))
{
array_push($code_pd, $ligne_pd['idpd']);
array_push($nom_pd, $ligne_pd['nompd']);
$nd1++;
}
/* Maintenant on peut construire la liste déroulante */
?>
<select name="produit" id="produit" onChange="showPP('this.value')> (c'est cette ligne qui pose problème)
<option value="-1">- - - précisez produit - - -</option>
<?php
for($p = 0; $p<$nd1; $p++)
{
?>
<option value="<?php echo($code_pd[$p]); ?>"<?php echo((isset($pd_selectionne) && $pd_selectionne == $code_pd[$p])?" selected=\"selected\"":null); ?>><?php echo($nom_pd[$p]); ?></option>
<?php
}
?>
</select>
---------------------------------------------------
responsexml.js
--------------------------------------------------------------
var xmlhttp
function showPP(str)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="responsexml.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}
function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
-------------------------------------------------------
responsexml.php
------------------------------------------------
<?php
$q=$_GET["q"];
$xmlDoc = new DOMDocument();
$xmlDoc->load("pd_catalog.xml");
$x=$xmlDoc->getElementsByTagName('NOM_PRODUIT');
for ($i=0; $i<=$x->length-1; $i++)
{
//Process only element nodes
if ($x->item($i)->nodeType==1)
{
if ($x->item($i)->childNodes->item(0)->nodeValue == $q)
{
$y=($x->item($i)->parentNode);
}
}
}
$pp=($y->childNodes);
for ($i=0;$i<$pp->length;$i++)
{
//Process only element nodes
if ($pp->item($i)->nodeType==1)
{
echo("<b>" . $pp->item($i)->nodeName . ":</b> ");
echo($pp->item($i)->childNodes->item(0)->nodeValue);
echo("<br />");
}
}
?>
------------------------------------------
j'ai une liste déroulante "produit" qui est liée à une bd Mysql via PHP
j'aimerai pas surcharger ma bd avec les données, et j'aimerai quand la liste affiche le nom d'un produit "X", une requete "XMLHTTPrequest" permettera de lister en bas la fiche technique du produit à partir d'un fichier XML
la liste est correctement liée à la table correspondante, le problème est au niveau du "onchange :", qui empeche le résultat de la requette JS de s'afficher en bas
merci d'avance pour votre assistance!
voilà mon code (index.php+responsexml.js+responsexml.php+pd_catalog.xml)
index.php
----------------------------------------
............................
<head>
<script type="text/javascript" src="responsexml.js"></script>
<title>catalogue</title>
</head>
...............................
* Cération de la requête pour avoir la liste des produits */
$sql3 = "SELECT `idpd`, `nompd`".
" FROM `produit`".
" WHERE `idtype` = ". $idr2 ."".
" ORDER BY `idpd`;";
if($connexion != false)
{
$rech_pd = mysql_query($sql3, $connexion);
/* Un petit compteur pour les départements */
$nd1 = 0;
/* On crée deux tableaux pour les numéros et les noms des produits */
$code_pd = array();
$nom_pd = array();
/* On va mettre les numéros et noms des produits dans les deux tableaux */
while($ligne_pd = mysql_fetch_assoc($rech_pd))
{
array_push($code_pd, $ligne_pd['idpd']);
array_push($nom_pd, $ligne_pd['nompd']);
$nd1++;
}
/* Maintenant on peut construire la liste déroulante */
?>
<select name="produit" id="produit" onChange="showPP('this.value')> (c'est cette ligne qui pose problème)
<option value="-1">- - - précisez produit - - -</option>
<?php
for($p = 0; $p<$nd1; $p++)
{
?>
<option value="<?php echo($code_pd[$p]); ?>"<?php echo((isset($pd_selectionne) && $pd_selectionne == $code_pd[$p])?" selected=\"selected\"":null); ?>><?php echo($nom_pd[$p]); ?></option>
<?php
}
?>
</select>
---------------------------------------------------
responsexml.js
--------------------------------------------------------------
var xmlhttp
function showPP(str)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="responsexml.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}
function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
-------------------------------------------------------
responsexml.php
------------------------------------------------
<?php
$q=$_GET["q"];
$xmlDoc = new DOMDocument();
$xmlDoc->load("pd_catalog.xml");
$x=$xmlDoc->getElementsByTagName('NOM_PRODUIT');
for ($i=0; $i<=$x->length-1; $i++)
{
//Process only element nodes
if ($x->item($i)->nodeType==1)
{
if ($x->item($i)->childNodes->item(0)->nodeValue == $q)
{
$y=($x->item($i)->parentNode);
}
}
}
$pp=($y->childNodes);
for ($i=0;$i<$pp->length;$i++)
{
//Process only element nodes
if ($pp->item($i)->nodeType==1)
{
echo("<b>" . $pp->item($i)->nodeName . ":</b> ");
echo($pp->item($i)->childNodes->item(0)->nodeValue);
echo("<br />");
}
}
?>
------------------------------------------
A voir également:
- Liste déroulante+AJAX+fichier xml
- Liste déroulante excel - Guide
- Fichier bin - Guide
- Liste déroulante en cascade - Guide
- Fichier epub - Guide
- Fichier rar - Guide
5 réponses
function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
} Si la répons est un XML, tu dois utiliser xmlhttp.responseXML.
Donc tu ne peux pas faire un innerHTML : il faut parser avec DOM en JS.
« Je suis pas informaticien de métier » (provient de ton MP)
Moi non plus, je n'ai que 14 ans.
Ton ordinateur ne fait pas ce que tu veux ... mais ce que tu lui dis de faire.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question