Textarea dynamique par un menu déroulant dynamique
Bonjour,
Il y a quelque temps, et grâce à l'aide d'un membre de ce forum réussi a mettre en place et a comprendre un système de double liste déroulante dynamique, la seconde étant dépendante de la première.
J'ai repris ce code et je souhaite l'adapter pour rendre dynamique le textarea de mon formulaire.
Malheureusement, je ne suis pas vraiment spécialisé javascript et mon ancien script commence a dater. Je dois admettre que j’ai un peu de mal. Je sens que je touche au but mais je n’arrive pas a l’atteindre.
Pour faire simple : j'ai un menu déroulant rempli a partir d'une table "produits" de ma DB de forme
<option value='id du produit'>Catégorie - Titre du produit </option>
Je souhaite preformater mon textarea avec la description du produit correspondante au choix fait précédemment dans mon menu déroulant.
J'espère avoir été assez clair.
Voici mes sources. Si quelqu'un pouvait me mettre sur la voix ce serait sympa :)
Afin d'éviter de devoir vous donner un gros paquet de code, sachez que mes includes sont bons et que ma liste déroulante se remplie bien.
index.php:
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
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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
|
function getXhrTrap(){
if(window.XMLHttpRequest) // Firefox et autres
var xhrT = new XMLHttpRequest();
else if(window.ActiveXObject){ // Internet Explorer
try {
var xhrT = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
var xhrT = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else {
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
var xhrT = false;
}
return xhrT;
}
function getDesc() {
var Id_produit = document.getElementById('id_produit').value;
var arg = 'Id_produit='+Id_produit;
var xhrT = getXhrTrap();
xhrT.open("POST","ajaxProduits.php",true);
xhrT.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhrT.send(arg);
xhrT.onreadystatechange = function()
{
if(xhrT && xhrT.readyState == 4 && xhrT.status == 200 && xhrT.responseXML)
{
reponseT = xhrT.responseXML.documentElement;
var description = reponseT.getElementsByTagName("description");
var str = "";
var rechCount = description.length;
for(i = 0; i < rechCount; i++) {
str += " - " + description[i].value;
}
var selbox = document.getElementById("description");
selbox.value = str;
}
}
}
$produits_list = "<select class='texte_select' name = 'id_produit' tabindex='3' id= 'id_produit' onchange='getDesc(this.form.id_produit.value);'";
while ( $row = mysql_fetch_array( $result_produits)) {
$Produit_Id = $row["Ref"];
$Produit_categorie = $row["Categorie"];
$Produit_titre = $row["Titre"];
$Produit_desc = $row["Description"];
$produits_list .= "<OPTION value='$Produit_titre'>$Produit_categorie - $Produit_titre</OPTION>";
}
$produits_list .= "</SELECT>";
<form method="post" action="index.php?action=add" name="form">
<input type="submit" value="Enregistrer" id="submit" name="submit" />
<br/>
Titre :<?php echo $produits_list ?>
Descriptions :
<textarea id="description" name="description" rows="10" cols="72" >
</textarea>
</br>
</form> |
ajaxProduits.php
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
| <?php
if (isset($_POST["Id_produit"])) {
$buffer = '<div id="desc">';
$buffer .= '<?xml version="1.0"?>';
mysql_connect("localhost","xxxxxxxxx","xxxxxxxxxxx");
mysql_select_db("xxxxxxxxxxxxxx");
$res = mysql_query("SELECT * FROM Produits WHERE Ref = '".$_POST['Id_produit']."' ");
while($row = mysql_fetch_assoc($res)){
$buffer .='<Description id="desc2"><description>'.$row['Description'].'</description></Description>';
}
$buffer .='</div>';
header('Content-Type: text/xml');
print $buffer;
}
?> |
J'ai essayer pas mal de chose jusqu'à présent, mais soit il n'y a pas eu de changement soit j'avais un retour vide, soit un ""undefined"" soit un "[object HTMLCollection]"
Merci pour votre temps!
Bonne journée
