11550 sujets

JavaScript, DOM et API Web HTML5

Bonjour tout le monde,

voici mon objectif :

2 menus déroulants, 1 pour choisir la marque du véhicule (viens d'une table) et l'autre le modèle (vient d'une table aussi), donc quand je sélectionne une marque seul les modèles qui ont l'id de la marque doivent être affichés dans le select Smiley smile

Voici mon bout de code :

nom de la page ajout_vehicule.php

a écrit :

<head
function trier_marque()
{
var marque = document.getElementById("marque").value;
$.post('ajout_vehicule.php',
{id_marque: marque},
function(data){
$('.modele').html(data);
});
}
</head>
<body>
<?php
$req = mysql_query("SELECT id, nom FROM ${tblpref}marquevehi");

echo "<select name='marque' id='marque'onchange='trier_marque();'>";
echo "<option value='0'>Choix de la marque</option>";

while ($marque = mysql_fetch_array($req))
{
echo "<option value='". $marque['id'] ."'>". $marque['nom'] ."</option>";
}
echo "</select>";

$req = "SELECT * FROM ${tblpref}modelevehi WHERE id_marque =".$_POST['id_marque'].";";
$resultat = mysql_query($req);

echo "<select name='modele'>";
echo "<option value='0'>Choix du modèle</option>";

while ($modele = mysql_fetch_array($resultat))
{
echo "<option value='". $modele['id'] ."'>". $modele['nom'] ."</option>";
}
echo "</select>";
?>
</body>


le résultat et bien je ne le vois pas sur la page mais avec firebug :

http://www.hostingpics.net/viewer.php?id=23789881pb.png

Pour vous épargnez le décriptage, voila ce qui est intéressant :

a écrit :

<select name='modele'>
<option value='0'>Choix du modèle</option>
<option value='121'>307</option>
</select>


DOnc j'aimerais savoir comment faire pour que ça ce vois sur la page et pas seulement dans firebug Smiley smile

merci ^^
Modifié par NKVD (29 Feb 2012 - 17:21)
Modérateur
Et l'eau,

1. erreur dans la console ! (ligne 84)
2. Si tu fais la requêtes dans la console mysql, est ce que tu obtiens un résultat convaincant ?
2bis. si tu fais un print_r($modele) est ce que tu as un résultat convaincant également ?
3. Perso, j'ai pas l'habitude d'écrire comme ceci : ... ${tblpref} ....
4. réponse subsidiaire : ton select est bien en display block ou inline-block et non pas none ?

Au passage, je ne vois pas de test de query.... Ton appel ajax peut bien se passer, mais si ta requête est bidon, tu auras un résultat en carton....
Modifié par niuxe (01 Mar 2012 - 01:17)
niuxe a écrit :
Et l'eau,

1. erreur dans la console ! (ligne 84) sans importance Smiley smile
2. Si tu fais la requêtes dans la console mysql, est ce que tu obtiens un résultat convaincant ?
oui :
id nom id_marque
121 307 59

2bis. si tu fais un print_r($modele) est ce que tu as un résultat convaincant également ?
Oui, petit bout :
Array ( [0] => 1 Smiley id => 1 [1] => AC Cobra Smiley nom => AC Cobra [2] => 0 [id_marque] => 0 ) Array ( [0] => 2 Smiley id => 2 [1] => Palette Acura Smiley nom => Palette Acura [2] => 0 [id_marque] => 0 )

3. Perso, j'ai pas l'habitude d'écrire comme ceci : ... ${tblpref} ....ça contient le préfixe des tables Smiley smile
4. réponse subsidiaire : ton select est bien en display block ou inline-block et non pas none ?
Il est en display par défaut
Au passage, je ne vois pas de test de query.... Ton appel ajax peut bien se passer, mais si ta requête est bidon, tu auras un résultat en carton.... La requete fonctionne bien sinon il n'y aurait pas 307 d'afficher dans le script sur firebug

Merci de m'avoir répondu Smiley smile
Modérateur
1. Non je pense que dans un premier temps tu devrais rectifier l'erreur ou la masquer (commenter) afin que ton JS soit ok.

4. si dans firebug tu obtiens ce genre de choses (ci-dessous), alors, il y a un soucis CSS. A moins que tu aies fait du css avec du JS (mauvaise pratique....), alors voir de ce côté là.
http://img717.imageshack.us/img717/2872/ajaxu.png ,
Modifié par niuxe (01 Mar 2012 - 13:50)
1. je ne sais meme pas d'où sa viens, et puis j'ai un code js qui fonctionne donc ...
2. non quand je vais sur html le select n'apparait pas déjà Smiley smile
Modérateur
J'ai mieux regarder ton code. Je vais éviter de faire des commentaires dessus. Parcequ'il y a dire beaucoup....

1. On est d'accord que :

SELECT * FROM [b]-prefixEcritEnDure-[/b]modelevehi WHERE id_marque ='[b]une valeur ecrite en dure[/b]';

si tu ecris cela dans la un terminal MySql, tu as quelque chose de concret ?

2. On est d'accord que ton select de départ est impeccable ? du style :

<select name="marque" id="marque">
    <option value="0">choisir marque</option>
    <option value="2">rino</option>
    <option value="3">far</option>
    <option value="4">un</option>
    <option value="5">gite</option>
</select>


3. Si c'est le cas, que vaut data ?


console.log(data);


3bis. Si ce n'est pas le cas, que vaut $_POST ? (je pense que tu as quelque chose puisque tu m'as dit que print_r($modele) est bon.)
4. Je ne vois pas de classe .modele, fouiller par là. Smiley cligne

$('.modele').html(data);


5 Pour finir, rectifier l'erreur JS qui traine !
6. je ne vois pas les éléments scripts....
7. Code difficile à lire....
Modifié par niuxe (01 Mar 2012 - 23:29)
Dsl si mon code n'est pas clair, pour ce qui est de la classe modele, je l'avais mise puis enlevée Smiley ohwell


$req1 = "SELECT * FROM ${tblpref}modelevehi WHERE id_marque ='".$_POST['id_marque']."'";
$resultat = mysql_query($req1);
echo "<select id='modele' name='modele'>";
echo "<option value='0'>Choix du modèle</option>"; 

while ($modele = mysql_fetch_array($resultat))
{
    echo "<option value='". $modele['id'] ."'>". $modele['nom']."</option>";
}  
echo "</select>";


si je choisi peugeot :

rendu sur la page:
http://hpics.li/c19af8a
C'est normal s'ils y a plein de modèle c'est parce que la pluspart on le champ id_marque vide Smiley smile

sur firebug :
http://hpics.li/c2cbe09

Sinon

1 : oui si je tape par ex id_marque= 59, sa me sort 307
2 : data ?
3 :
3 bis : si tu parle du post renvoyer par le js :

http://hpics.li/7bc1ef2

4: répondu plus haut Smiley smile
5 : ...
6 : éléments scripts ?
7 .: dsl Smiley ohwell

Je ne comprends pas grand chose au js je dois bien l'avouer Smiley ohwell
Modifié par NKVD (02 Mar 2012 - 00:13)
Je n'ai pas assez réfléchis ^^

j'avais éé proche de la solution mais bon XD

page principale : ajout_vehicule.php

fonction :

function trier_marque()
{
var marque = document.getElementById("marque").value;   
$.post('script_modele.php',      
{id_marque: marque},        
function(data){ 
 $('.mod').html(data); 
});
}


page : script_modele.php

<?php

require_once("include/config/common.php");
?>
<div class='mod'>
<?php
$req1 = "SELECT * FROM ${tblpref}modelevehi WHERE id_marque ='".$_POST['id_marque']."'";
$resultat = mysql_query($req1);
echo "<select id='modele' name='modele'>";
echo "<option value='0'>Choix du modèle</option>"; 

while ($modele = mysql_fetch_array($resultat))
{
    echo "<option value='". $modele['id'] ."'>". $modele['nom']."</option>";
}  
echo "</select>";
?>
</div>
<?php


Bas de ajout_vehicule.php
<?php
$req = mysql_query("SELECT id, nom FROM ${tblpref}marquevehi");

echo "<select name='marque' id='marque' onchange='trier_marque();'>"; 
echo "<option value='0'>Choix de la marque</option>";

while ($marque = mysql_fetch_array($req))
{
    echo "<option value='". $marque['id'] ."'>". $marque['nom'] ."</option>";
}  
echo "</select>";

include('script_modele.php');
?>


Voila merci pour ton aide Smiley smile
Modérateur
Quand je te parle de data, c'est normal. Regarde ton appel ajax :


function(data){
$('....').html(data);
console.log(data);
}