Liste déroulante php/javascript et selected

Marsh Posté le 31-08-2007 à 10:02:39

Bonjour,

Je ne suis pas très forte en Javascrip et apparement un peu dépassée en php (je ne suis pas développeuse mais j'ai en charge les sites internet dans la société où je travaille).

J'ai un soucis qui pourrait se résoudre très vite si vous pourriez m'aider ...

Je vous explique ce que je dois faire sur le site où je travaille actuellement :
J'ai 2 listes déroulantes remplient dynamiquement par des requetes SQL.
Ma 2em liste apparait lorsque j'ai fait un 1er choix dans ma 1er liste déroulante.
Lorsque j'ai fait le choix dans ma 2em liste déroulante, le formulaire est lancé.
C'est pour cela que j'ai du me servir du javascript que je ne connais pas du tout.

J'ai donc cherché un script que j'ai adapté en remplissante mes listes grace à des requetes.

Jusque la tout va bien.

Mon soucis actuel, est que je dois garder le contenu de ma 1er liste lorsque j'ai déjà fait un 1er choix.
Tout ceux qui programme un peu en PHP sait que cela est possible grace à l'attribut "selected" de la balise <option> mais je suis ici dans un cas qui me dépasse puisque je ne comprend rien à la ligne correspondante. Et je ne saurais dire cela vient du javascript ou du php.

Pourriez vous m'aider à comprend quelle est la variable qui reprend la variable choisie ? et comment la passé dans mon selected lorsque qu'elle existe ?

Voici le code de la ligne que je ne comprend pas et qui contient le selected :

Code :

<option value="<?php echo($code_region[$i]); ?>"<?php echo((isset($idr) && $idr == $code_region[$i])?" selected=\"selected\"":null); ?>><?php echo($region[$i]);

Et voici le code de ma page entière si cel peut vous aider à comprendre le fonctionnement :

Code :

<?php
echo("<?xml version=\"1.0\" encoding=\"iso-8859-1\"?>\n" );
/* Variables de connexion : ajustez ces paramètres selon votre propre environnement */
$serveur = ""; // voir hébergeur
$admin = ""; // vide ou "root" en local
$mdp = ""; // vide en local
$base = ""; // nom de la BD
/* On récupère si elle existe la valeur de la région envoyée par le formulaire */
$idr = isset($_POST['region'])?$_POST['region']:null;
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml " xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" xml:lang="fr" />
<title>Sélectionner un département selon la région choisie</title>
<script>
function Lien (f)
{
i = f.elements['domaine'].selectedIndex;
if (i == 0) return;
top.location = 'domaine.php?page=dom&region=' + f.elements['region'].value + '&domaine=' + f.elements['domaine'].value;
}
</script>
</head>
<body>
<?php
if(isset($_POST['domaine']) && $_POST['domaine'] != "" )
{
$region_selectionnee = $_POST['region'];
$dept_selectionne = $_POST['domaine'];
?>
<p>
<?php
}
?>
</p>
<h3>
<?php
/* On établit la connexion à MySQL avec mysql_pconnect() plutôt qu'avec mysql_connect()
* car on aura besoin de la connexion un peu plus loin dans le script */
$connexion = mysql_pconnect($serveur, $admin, $mdp);
if($connexion != false)
{
$choixbase = mysql_select_db($base, $connexion);
$sql1 = "SELECT `id_region`, `nom_region` FROM `region` ORDER BY `nom_region`";
$rech_regions = mysql_query($sql1);
$code_region = array();
$region = array();
/* On active un compteur pour les régions */
$nb_regions = 0;
if($rech_regions != false)
{
while($ligne = mysql_fetch_assoc($rech_regions))
{
array_push($code_region, $ligne['id_region']);
array_push($region, $ligne['nom_region']);
/* On incrémente de compteur */
$nb_regions++;
}
}
?>
</h3>
<form action="<?php echo($_SERVER['PHP_SELF']); ?>" method="post" id="chgdept">
<table width="228" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2">
<select name="region" id="region" class="deroulant" onchange="document.forms['chgdept'].submit();">
<option value="-1">- Choisissez votre région -</option>
<?php
for($i = 0; $i < $nb_regions; $i++)
{
?>
<option value="<?php echo($code_region[$i]); ?>"<?php echo((isset($idr) && $idr == $code_region[$i])?" selected=\"selected\"":null); ?>><?php echo($region[$i]);
?>
</option>
<?php
}
?>
</select>
</td>
</tr>
<tr>
<td colspan="2"><img src="images/spacer.gif" width="1" height="10" /></td>
</tr>
<tr>
<td width="203" height="22">
<?php
mysql_free_result($rech_regions);
/* On commence par vérifier si on a envoyé un numéro de région et le cas échéant s'il est différent de -1 */
if(isset($idr) && $idr != -1)
{
/* Cération de la requête pour avoir les départements de cette région */
$sql2 = "SELECT id_domaine, nom_domaine, id_region, region_domaine_ FROM domaine, region WHERE `id_region` = ". $idr ." and region_domaine_ = id_region ORDER BY `nom_domaine`";
if($connexion != false)
{
$rech_dept = mysql_query($sql2, $connexion);
/* Un petit compteur pour les départements */
$nd = 0;
/* On crée deux tableaux pour les numéros et les noms des départements */
$code_dept = array();
$nom_dept = array();
/* On va mettre les numéros et noms des départements dans les deux tableaux */
while($ligne_dept = mysql_fetch_assoc($rech_dept))
{
array_push($code_dept, $ligne_dept['id_domaine']);
array_push($nom_dept, $ligne_dept['nom_domaine']);
$nd++;
}
/* Maintenant on peut construire la liste déroulante */
?>
<select name="domaine" id="departement" class="deroulant" onchange="Lien(this.form);">
<option value="-1">- Choisissez votre domaine -</option>
<?php
for($d = 0; $d<$nd; $d++)
{
?>
<option value="<?php echo($code_dept[$d]); ?>"<?php echo((isset($dept_selectionne) && $dept_selectionne == $code_dept[$d])?" selected=\"selected\"":null); ?>><?php echo($nom_dept[$d]."" ); ?></option>
<?php
}
?>
</select>
</td>
<?php
}
/* Un petit coup de balai */
mysql_free_result($rech_dept);
$region=$_POST['region'];
$domaine=$_POST['domaine'];
?>
<td width="25">
<div align="center">
<?php
if ($domaine!='') {
echo "";
}
else {
echo "";
}
} ?>
</div></td>
</tr>
</table>
</form>
<?php
/* Terminé, on ferme la connexion */
mysql_close($connexion);
}
else
{
/* Si on arrive là, c'est pas bon signe, il faut vérifier les
* paramètres de connexion, mot de passe, serveur pas démarré etc... */
?>
<p>Un incident s'est produit lors de la connexion à la base de données, veuiillez essayer à nouveau ultérieurement.</p>
<?php
}
?>
</body>
</html>

En espérant que vous pourrez m'aider !

Merci pour votre écoute !

Reply

Marsh Posté le 31-08-2007 à 10:02:39

Reply

Marsh Posté le 04-09-2007 à 12:31:58

Et bien, au debut, les éléments de votre liste "regions" sont générés par les lignes 73 à 80 (compris) du code, qui, à travers une boucle, affiche tous les regions.
Lorsque l'utilisateur selectionne un region precis dans la liste, JavaScript (noté JS par la suite) envoie le formulaire (ligne 69) de la page. Ainsi, le numéro du region choisi par l'utilisateur peut être recupéré via la variable $_POST['region'].

La ligne 9 attribue la valeur de $_POST['region'] à la variable $idr :

Code :

$idr = isset($_POST['region'])?$_POST['region']:null;

Ainsi, une fois la selection de region faite, le script PHP connait le numéro du region selectionné à travers la variable $idr (affectée de la valeur $_POST['region']). A partir de là, lorsque, lignes 73 à 80 du code, les éléments de la liste "regions" sont générés à nouveau, l'élément dont le numéro (propriété HTML "value" ) correspond à la valeur de $idr est selectionné, car la propriété "selected" lui est ajoutée, cf. ligne 76 :

Code :

echo((isset($idr) && $idr == $code_region[$i])?" selected=\"selected\"":null

PS. Il y a une methode plus élégante de faire la selection en deux listes successives : si vous avez le temps, allez voir du coté de la téchnologie AJAX (http://fr.wikipedia.org/wiki/AJAX). AJAX a un inconvenient d'utiliser du JS, et donc d'être inacessible pour tout navigateur avec JS désactivé, mais de toute façon, vote page actuelle est déjà inaccessible de ce point de vue, donc...

Reply

Marsh Posté le 04-09-2007 à 14:40:33

Merci MainMa pour vos explications.
J'ai remodeler les if? condition1:sinon 2 par du code plus compréhensible pour moi mais je n'rrive tjr pas à faire ce que je souhaite :
retrouver ma 1er liste en selected avec le choix effectué par l'utilisateur afin qu'il ne soit pas perdu dans se recherche lorsqu'il a fait son choix dans la 2em liste.

Mais merci quand même.

Message cité 1 fois

Reply

Marsh Posté le 04-09-2007 à 15:09:11

Adaviada a écrit :

J'ai remodeler les if? condition1:sinon 2 par du code plus compréhensible pour moi

Faut s'habituer, c'est tout...

Citation :

mais je n'rrive tjr pas à faire ce que je souhaite :
retrouver ma 1er liste en selected avec le choix effectué par l'utilisateur afin qu'il ne soit pas perdu dans se recherche lorsqu'il a fait son choix dans la 2em liste.

Gné ? Mais là, en ce moment, après que l'utilisateur a choisi la région dans la première liste et que la page a changé, la première liste n'a rien de sélectionné ?

Vérifiez déjà si la source HTML (générée après la sélection par l'utilisateur et le changement de page) contient bien un et un seul "<option value="..." selected="selected">...</option>" parmi les éléments de la liste des regions...

Reply

Marsh Posté le 04-09-2007 à 15:15:55

Citation :

Gné ? Mais là, en ce moment, après que l'utilisateur a choisi la région dans la première liste et que la page a changé, la première liste n'a rien de sélectionné ?

Et bien oui justement ! C'est ce que je cherche à faire, que la region selectionnée le reste dans ma 1er liste déroulante une fois que l'utilisateur a lancé les infos or en ce moment elle se remet à O.

Et je n'ai pas bien compris ce que vous voulez que je fasse en "vérifiant que la source ne contient bien qu'un seul <option> parmis les éléments de la liste région ... car cela est le cas il me semble.

Message cité 1 fois

Reply

Marsh Posté le 04-09-2007 à 15:19:10

Adaviada a écrit :

Et je n'ai pas bien compris ce que vous voulez que je fasse en "vérifiant que la source ne contient bien qu'un seul <option> parmis les éléments de la liste région ... car cela est le cas il me semble.

Bon, postez juste le code HTML de la page qui s'affiche juste après que l'utilisateur sélectionne un élément dans la première liste.

Reply

Marsh Posté le 04-09-2007 à 15:31:40

Code :

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" xml:lang="fr" />
<title>Sélectionner un département selon la région choisie</title>
<script>
function Lien (f)
{
i = f.elements['domaine'].selectedIndex;
if (i == 0) return;
top.location = 'domaine.php?page=dom&region=' + f.elements['region'].value + '&domaine=' + f.elements['domaine'].value;
}
</script>
<meta name="description" content="Listes déroulantes dynamiques inter-dépendantes" />
<meta name="keywords" content="" />
<meta name="author" content="Cyrano" />
<meta name="generator" content="Zend Studio Environnement et WebExpert 5" />
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="Pragma" content="no-cache" />
<link href="css.css" rel="stylesheet" type="text/css" />
</head>
<body style="font-family: verdana, helvetica, sans-serif; font-size: 85%">
<form action="domaine.php?page=dom&&region=&&domaine=" method="post" id="chgdept">
<table width="244" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2">
<img src="images/spacer.gif" width="10" height="10"/>
<select name="region" id="region" class="deroulant" onchange="document.forms['chgdept'].submit();">
<option value="-1">- Choisissez votre région -</option>
<option value='2'>L'Alsace</option>
<option value='3'>La Bourgogne</option>
<option value='1'>La Champagne</option>
<option value='9'>La Provence</option>
<option value='6'>La Vallée de la Loire</option>
<option value='7'>La Vallée du Rhône</option>
<option value='5'>Le Bordelais</option>
<option value='4'>Le Jura</option>
<option value='8'>Le Languedoc Roussillon</option>
</select>
</td>
</tr>
<tr>
<td colspan="2"><img src="images/spacer.gif" width="1" height="10" /></td>
</tr>
<tr>
<td width="227" height="22">
</td>
</tr>
</table>
</form>
</body>
</html>

Reply

Marsh Posté le 04-09-2007 à 16:10:13

Alors oui, j'avoue d'être embarrassé... A voir votre code HTML, y a rien qui est posté (enfin... lors de l'envoi du formulaire, rien n'est envoyé).

Dès lors, essayez déjà de voir si sans JS ça marche (vous ajoutez juste un bouton du type submit à votre formulaire et vous supprimez le

Code :

onchange="document.forms['chgdept'].submit();"

de la ligne 69.

Sinon, essayez aussi d'afficher le contenu de $_POST :

Code :

echo "<pre>" . print_r($_POST, true) . "</pre>";

Je devine déjà la résultat (un tableau vide quoi), mais sait-on jamais...

Désolé de ne pas pouvoir vous donner d'avantage d'aide... Mais c'est vrai qu'avec un code aussi mal écrit, c'est pas facile de comprendre quelque chose et de le debuguer.

Reply

Marsh Posté le 04-09-2007 à 16:15:03

Citation :

Désolé de ne pas pouvoir vous donner d'avantage d'aide... Mais c'est vrai qu'avec un code aussi mal écrit, c'est pas facile de comprendre quelque chose et de le debuguer.

J'ai récupéré ce code pour réussir à faire le chargement d'une liste déroulante par rapport au choix d'une 1er liste déroulante ...
Je ne comprend pas ce que vous cherchez à faire en me demandant d'afficher le code HTML ...

M'enfin bon ...

Je veux juste mettre en <selected> ce que j'ai eu en POST et qui s'affiche en GET dans ma page principale ...
Ce n'est quand même pas si difficile je pense mais je n'y arrive pas... c'est un comble que je but sur un simple seleted ..;

Olala misère ! ca fait 3 semaines que je suis coincée la dessus ... mon client s'impatiente ...

Je ne sais plus quoi faire ...

Reply

Marsh Posté le 04-09-2007 à 16:30:12

Citation :

Je ne comprend pas ce que vous cherchez à faire en me demandant d'afficher le code HTML ...

J'explique : si, à la page qui s'affiche après qu'un utilisateur a sélectionné un élément dans la liste, aucun élément n'est sélectionné, alors deux problèmes sont envisageables : soit le code HTML formé reçoit tout correctement, mais contient lui même une erreur, soit il y a déjà quelque chose qui ne va pas avant, et la nouvelle page ne reçoit rien du tout.
En vous demandant de me donner le code HTML, je voulais ainsi vérifier s'il s'agit d'un problème lié au code HTML ou un problème antérieur. En l'espèce, le code HTML que vous avez donné montre que le problème est antérieur.

Dès lors, j'ai supposé qu'aucune variable n'est postée. C'est pour cela que je vous ai demandé ensuite de le vérifier. Et puisque vous utilisez un code JS barbare pour le postage lors de la sélection, il peut y avoir un problème à ce niveau là : dès lors, je vous ai demandé de vérifier si ça marche lorsqu'on remplace le code JS barbare par une solution normale d'un bouton submit.

Voilà. Tout vous semble être logique maintenant dans mes messages d'avant ?

Reply

Marsh Posté le 04-09-2007 à 16:30:12

Reply

Marsh Posté le 04-09-2007 à 16:36:27

Oui ok mais je ne vois pas comment on peut voir ce qui a été selection en PHP grace au code HTML ...
Sachant surtout que ma page contenant les listes déroulantes est présente en include() sur ma page principale...

Peut être que le code HTML que je vous ai présenté n'est pas correct !

Mon code fonctionnait très bien avec le bouton submit, mais cela avant que je cherche à ce que la 1er liste ait en selected la dernière région sélectionnée...

Peut être cela peut-il vous aider ??

Reply

Marsh Posté le 04-09-2007 à 16:43:38

Et bien c'est les lignes 31 à 40 qui sont intéressants dans votre code HTML. Car il n'y a pas de propriété "selected" nul part. Et tant qu'il n'y a pas de "selected", on peut penser qu'il y a un problème bien avant (soit dans l'envoi du formulaire par JS, soit dans le traitement des informations reçus après l'envoi par PHP).

Citation :

Mon code fonctionnait très bien avec le bouton submit, mais cela avant que je cherche à ce que la 1er liste ait en selected la dernière région sélectionnée...

Ben essayez de remettre le bouton, et dites nous si ça marche.

Reply

Marsh Posté le 04-09-2007 à 17:12:18

Je vous avourais que mon soucis a déjà été de l'enlever !!!
Je n'y connais rien en JS !

J'ai déjà poster des milles et des fois pour que l'on m'aider à retirer le bt submit ... alors le remettre ...

Bon je crois qu ca commence vraiement à m'agasser tout ca ...

Est-ce qu'on ne pourrait pas refaire un code ? Ne serait-ce pas plus simple ??

Reply

Marsh Posté le 04-09-2007 à 18:31:53

Citation :

Est-ce qu'on ne pourrait pas refaire un code ? Ne serait-ce pas plus simple ??

Oui. On peut. Par contre aujourd'hui je n'ai vraiment pas le temps. Désolé.

Reply

Marsh Posté le 04-09-2007 à 18:38:21

Merci quand même pour tout !

Reply

Marsh Posté le 06-09-2007 à 14:14:26

Voilà. Je vous ai fait un exemple de base (qui utilise notamment AJAX dont je vous ai conseillé ci-dessus).

Démonstration : http://pelican.homedns.org/en-us/pub/dynlist/
Source code : http://pelican.homedns.org/en-us/p [...] source.zip

Il reste donc à faire le lien entre le code, et la base de données où le fichier XML comportant la liste des régions et départements.

J'ai vérifié, le code actuel marche sour Firefox 2 et IE6. Je n'ai pas vérifié s'il marche bien sous IE7 et Opera (donc à faire, si vous comptez utiliser ce code sur votre site).

PS. Petit problème, on ne peut pas mettre des noms avec les accents aux départements. En plus, je sais plus ni d'où est-ce que ça vient, ni comment résoudre la chose (et j'ai pas le temps de chercher). Si quelqu'un sur ce forum peut nous aider sur ce point...

Reply

Marsh Posté le 06-09-2007 à 14:28:59

J'ai trouvé la solution juste avant midi !!

Merci pour tout !

Reply

Liste déroulante php/javascript et selected

Sujets relatifs:

Leave a Replay