enieme sujet sur onchange / ListBox

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : enieme sujet sur onchange / ListBox

bixibu

Ca ... c'est fait!

Salut

Bon je craque, ca fait 2h que je lutte avec Javascript qui d'ailleurs devrais pas exister tellement c'est chiant .. mais bon d'un autre coté j'en ai besoin

J'ai ce code :

Code :

function aff_matos_on_off(){
if( document.forms.modif_infos_dossier.type_aide.options.value ==0)
document.getElementById("matos_on_off" ).className="aff_div";
else
document.getElementById("matos_on_off" ).className="cache_div";
}

Code :

<form name="modif_infos_dossier" class="form_profil" action="<? echo 'modif_dossier.php?infos_dossier='.$code_dossier.'&action=majdossier'; ?>" method="post">
<label for="type_aide">Type d'aide :</label>
<select name="type_aide" size='1' onchange=aff_matos_on_off() />
<option value="titre" class="selec_rub" style="margin: 0px;">Selection d'un type d'aide</option>
<option value="0">blabla</option>
etc...
</select><br class="clearall" />
<div id='matos_on_off' class="cache_div">YAHOO</div>

Donc en gros: quand je clique sur l'option dont la valeur est égale a 0 ca m'affiche la div et un beau YAHOOO

Probleme : ca marche sous IE mais pas sous Firefox.. JS est bien activé partout, firefox execute du JS ailleurs mais la ca bloque.

Une idée? je pige pas
merci

Publicité

anapajari

s/travail/glanding on hfr/gs;

C'est ton test avec le if qu'est n'importe quoi
Pour avoir la valeur de l'option selectionné, il faut utiliser selectedIndex, un truc dans le genre ( avec un id type_aide sur ton select):

Code :

function aff_matos_on_off(){
var selNode= document.getElementById('type_aide');
alert(selNode);
if( selNode.options[selNode.selectedIndex].value ==0){
document.getElementById("matos_on_off" ).className="aff_div";
} else {
document.getElementById("matos_on_off" ).className="cache_div";
}
}

Par ailleurs les " autour de la fonction appelée dans le onchange ça coute rien

bixibu

Ca ... c'est fait!

Merci de m'aider, c'est sympa..

Mais la je suis carrement démoralisé, j'ai une erreur "objet attendu" sous IE.
J'ai bien fait tout comme toi pourtant, j'ai meme pas l'alert

Je rend les armes

anapajari

s/travail/glanding on hfr/gs;

Code :

<!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="en" >
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<script type="text/javascript">
function aff_matos_on_off(){
var selNode= document.getElementById('type_aide');
if( selNode.options[selNode.selectedIndex].value ==0){
document.getElementById("matos_on_off" ).className="aff_div";
} else {
document.getElementById("matos_on_off" ).className="cache_div";
}
}
</script>
<style type="text/css">
.cache_div{
display: none;
}
.aff_div{
display: block;
}
</style>
</head>
<body >
<form name="modif_infos_dossier" class="form_profil" action="a.php" method="post">
<label for="type_aide">Type d'aide :</label>
<select name="type_aide" id="type_aide" size='1' onchange="aff_matos_on_off()" >
<option value="titre" class="selec_rub" style="margin: 0px;">Selection d'un type d'aide</option>
<option value="0">blabla</option>
</select>
<br class="clearall" />
<div id='matos_on_off' class="cache_div">YAHOO</div>
</form>
</body>
</html>

edit: Ah oui et le / a la fin de ta balise d'ouverte de select ça suxxe!

Message édité par anapajari le 11-04-2006 à 16:27:56

bixibu

Ca ... c'est fait!

Ok Bon je me suis repris en main

Ta solution marche parfaitement sous IE, l'alert me donne un "[object]"
Par contre sous FF j'ai une alerte avec dedans : "null"

Pas cool

edit:que je clique sur la bonne option ou pas j'ai "null"

pour le /> du select, merci j'avais pas vu! C'est un scandale

Message édité par bixibu le 11-04-2006 à 16:33:55

bixibu

Ca ... c'est fait!

Hum.. en recopiant ton code dans un nouveaudoc, FF affiche parfaitement comme il faut..

Je vais regarder mon code de bout en bout pour trouver l'erreur

bixibu

Ca ... c'est fait!

Ok quel con, j'ai oublié le id=" dans mon select..

Ca marche nikel maintenant.. Tous ca pour ca

Meric pour ton coup de main encore une fois

gatsu35

Blablaté par Harko

et pourquoi passer par le selected index alors que monselect.value marche ???

Message cité 1 fois

bixibu

Ca ... c'est fait!

Oui, c'est pareil, j'avais fait comme ca avant.

M'enfin ca marche, maintenant je dois alimenter une liste en fonction du clik sur option d'une autre list
Je connais la methode mais je vais en chier

en gros et normalement : je me suicide demain

Message cité 1 fois

bixibu

Ca ... c'est fait!

Salut

J'ai une autre petite question :

Est il possible en Javascript de compter le nombre d'options qui compose un select?
J'ai besoin de ce nombre pour incrementer la valeur de size="" du select .
Si ca existe pas, je me debrouillerais en php+javascript

EDIT:
bon j'ai compter le nombre d'options que je créé avec ma boucle php et j'ai ensuite modifier la valeur size avec javascript :
document.getElementById('choix_matos').size = <? echo $i; ?>

Message édité par bixibu le 12-04-2006 à 09:37:48

Publicité

anapajari

s/travail/glanding on hfr/gs;

gatsu35 a écrit :

et pourquoi passer par le selected index alors que monselect.value marche ???

Argh oui c'est vrai, c'est juste que j'ai tellement l'habitude de faire comme ça pour récuperer d'autres attributs sur les options que j'oublie que pour la valeur on peut faire si simplement...

bixibu a écrit :

M'enfin ca marche, maintenant je dois alimenter une liste en fonction du clik sur option d'une autre list
Je connais la methode mais je vais en chier
en gros et normalement : je me suicide demain

Utilise le DOM a fond et essaye de faire ça proprement...Un gros tu te fais une fonction qui génère tes options( et qui prend par exemple l'id du select visé et un array en params)

Code :

function buildOptions(idSel, arOpt){
var selNode;
if ( (selNode = document.getElementById(idSel)) == undefined){
return false;
}
/*** on vide les options qui peuvent déjà être dans le select ***
*** la version propre ( si il n'y a pas d'optgroup dans le bouzin)
while(selNode.getElementsByTagName('option').length){
selNode.removeChild(selNode.lastChild);
}
***
*** version rapide et bourrine: ***/
selNode.innerHTML = '';
/*** on ajoute les nouvelles options ***/
var optNode;
for(var i=0; i<arrOpt.length; i++){
optNode = document.createElement('option');
selNode.appendChild(optNode); /*** toujours faire l'appendChild avant de setter l'attribut value d'un option sinon IE se vautre comme une enorme merde, pourquoi? je sais pas ***/
optNode.setAttribute('value', arrOpt[i]); /***valeur retourné ***/
optNode.nodeValue = arrOpt[i]; /*** valeur affichée ***/
}
return true;
}

Voilou un truc comme ça, bon c'est non testé mais l'idée y est!!!

bixibu

Ca ... c'est fait!

Wowowow lol. Toujours aussi efficace anapajari.

En fait, j'ai un peu laissé tombé cette idée de liste qui en alimente une autre (mais ce que tu as posté, je m'en reservirais surement dans pas longtemps).
EN fait mon probleme est que je dois permettre a l'utilisateur de choisir un materiel qui fait partie d'une arborescence de type de materiel (Arbre de 2 sous catégorie max)

Je pensais donc faire selectionner a l'user la premiere catégorie via une listbox1.. qui affiche une autre listbox2 alimentée en fonction de listbox1 qui affiche cette fois les sous-catégorie de la catégorie
Puis cette listbox2 en appelerais ensuite une autre, avec cette fois les materiels eux meme! (seuls les matos de la cat et sous-cat precedemment renseigné bien sur) enfin!

Mais la je me suis tournée vers 1 seule grosse liste avec une taille fixe (pas les liste on clik et ca déroul mais la liste directement déroulé)

Pour l'instant une centaine de ligne sont affichés, ca passe.. Le plus gros prob c'est l'indentation des sous-cat sous IE.

Si vous voyez une meilleure soluce , je suis tout ouie

Merci :hello:

Message édité par bixibu le 12-04-2006 à 10:14:41

anapajari

s/travail/glanding on hfr/gs;

Perso j'aurais fait ça:

Code :

<!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="en" >
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<script type="text/javascript">
/*** param is a node which has been clicked ***/
function show(lnkNode){
var i;
/*** hiding all select***/
selNodes = document.getElementsByTagName('select');
for(i=0; i<selNodes.length; i++){
selNodes[i].className = "";
}
/*** hiding all parentNode.parentNode ul ***/
ulNodes=lnkNode.parentNode.parentNode.getElementsByTagName('ul');
for(i=0; i<ulNodes.length; i++){
ulNodes[i].className = "";
}
/*** showing lnk parentChild child ( either ul or select )***/
var sonsNode = lnkNode.parentNode.getElementsByTagName('*');
/*** first child is always lnk, so watching the second one ***/
sonsNode[1].className="disp";
return false;
}
</script>
<style type="text/css">
ul{
display: none;
}
ul.disp{
display: block;
}
select{
display: none;
}
select.disp{
display: inline;
}
</style>
</head>
<body >
<form name="modif_infos_dossier" class="form_profil" action="a.php" method="post">
<ul class="disp">
<li><a href="" onclick="return show(this)">Cat 1:</a>
<ul>
<li><a href="" onclick="return show(this)">Cat 1_1:</a>
<select>
<option>1_1_1</option>
<option>1_1_2</option>
<option>1_1_3</option>
</select>
</li>
<li><a href="" onclick="return show(this)">Cat 1_2:</a>
<select>
<option>1_2_1</option>
<option>1_2_2</option>
</select>
</li>
</ul>
</li>
<li><a href="" onclick="return show(this)">Cat 2:</a>
<ul>
<li><a href="" onclick="return show(this)">Cat 2_1:</a>
<select>
<option>2_1_1</option>
<option>2_1_2</option>
<option>2_1_3</option>
</select>
</li>
<li><a href="" onclick="return show(this)">Cat 2_2:</a>
<ul>
<li><a href="" onclick="return show(this)">Cat 2_2_1:</a>
<select>
<option>2_2_1_1</option>
<option>2_2_1_2</option>
</select>
</li>
<li><a href="" onclick="return show(this)">Cat 2_2_2:</a>
<select>
<option>2_2_2_1</option>
<option>2_2_2_2</option>
</select>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</form>
</body>
</html>

C'est super vite fait, il y a surement un ou deux bugs cachés mais ça doit pas être long... En plus c'est indépendant du niveau, si jamais tu as besoin tu peux en mettre autant que tu veux...

bixibu

Ca ... c'est fait!

Comment dire... C'est parfait!

Il m'aurait fallu 2 jours pour faire ca vu mon niveau en JS!

Merci Beaucoup !

Message cité 1 fois

anapajari

s/travail/glanding on hfr/gs;

bixibu a écrit :

Comment dire... C'est parfait!
Il m'aurait fallu 2 jours pour faire ca vu mon niveau en JS!
Merci Beaucoup !

Bin si tu regardes bien y'a rien de vraiment compliqué
Une fois que tu sais te promener dans les noeuds de ton document(et si celui-ci est correctement écrit) avec le DOM tu peux tout faire.

bixibu

Ca ... c'est fait!

Bon

j'ai 2 probleme et 1 question :

Question:
J'ai 1 formulaire tout bete dont un champs texte qui se rempli en cliquant sur un bouton. Ce bouton ouvre une pop-UP. Dans cette pop-up un autre formulaire contenant une listbox.

J'aimerais savoir comment faire pour récupérer dans mon champs texte de la page principal la valeur de l' "option" que l'utilisateur a cliqué. POST? GET? ou carrement du Javascript pur et dur?
ps:la page principal peut etre réactualisée.

Probleme:
Concernant cette meme pop-up, son ouverture se déclenche parfaitement sous Mozilla mais pas sous IE (5.0)
Est-ce normal (IE trop vieu ?) :

Code :

function aff_matos_on_off(){
if( document.getElementById('type_aide').value == 0){
window.open('choix_mat.php', 'Choix du matériel', 'width=500, height=400; top=100, left=100, toolbar=no, menubar=yes, location=yes, resizable=yes, scrollbars=yes, status=no');
}
}

Si je vire les 2 derniers parametre ca marche par contre (window.open('choix_mat.php') ca c ok )

Sinon, sous IE5 ton script bug a la ligne 25:
sonsNode[1].className="disp";
IE me dit que le 1 n'est pas un objet
pourtant ca devrait etre OK non?

Ca devrait etre mes dernieres questions ^^

Message cité 1 fois
Message édité par bixibu le 12-04-2006 à 14:09:55

anapajari

s/travail/glanding on hfr/gs;

bixibu a écrit :

Question:
J'ai 1 formulaire tout bete dont un champs texte qui se rempli en cliquant sur un bouton. Ce bouton ouvre une pop-UP. Dans cette pop-up un autre formulaire contenant une listbox.
J'aimerais savoir comment faire pour récupérer dans mon champs texte de la page principal la valeur de l' "option" que l'utilisateur a cliqué. POST? GET? ou carrement du Javascript pur et dur?
ps:la page principal peut etre réactualisée.

Vu que tu es parti sur du js de partout autant l'utiliser/en profiter/en abuser !
Dans la page html du popup, tu créées une fonction:

Code :

function setInputValue( obj, idInpText){
opener.document.getElementById(idInpText).value = obj.value;
/*** tu peux rajouter une fermeture automatique de la fenetre si tu as envie ***/
}

Et sur le select en question tu fais:

Code :

<select ... onchange="setInputValue(this, 'idDuChampsTexteViseDansLaPagePrincipale')">

Le "mot clé" à connaitre c'est opener, ça te permet d'acceder a la fenêtre ayant ouvert le pop-up dans lequel "tu es".
La fonction, tu peux t'en resservir ailleurs ci-besoin, il suffit juste de passer les bons paramètres.
note: code non testé comme d'hab, donc non garanti bug-proof

bixibu a écrit :

Probleme:
Concernant cette meme pop-up, son ouverture se déclenche parfaitement sous Mozilla mais pas sous IE (5.0)
Est-ce normal (IE trop vieu ?) :

Code :

function aff_matos_on_off(){
if( document.getElementById('type_aide').value == 0){
window.open('choix_mat.php', 'Choix du matériel', 'width=500, height=400; top=100, left=100, toolbar=no, menubar=yes, location=yes, resizable=yes, scrollbars=yes, status=no');
}
}

Si je vire les 2 derniers parametre ca marche par contre (window.open('choix_mat.php') ca c ok )

Le deuxième paramètre est le "nom de ta fenêtre", en fait c'est trompeur parce que c'est le "nom de la variable qui te permet d'accèder à ta fenêtre", et les espaces dans les noms de variables s'pas top
Dans enleve juste les espaces.

bixibu a écrit :

Sinon, sous IE5 ton script bug a la ligne 25:
sonsNode[1].className="disp";
IE me dit que le 1 n'est pas un objet
pourtant ca devrait etre OK non?

ça devait arriver... Le support du DOM sur IE5.5 est ... pas comme sur IE6
Tu peux essayer de ruser en forçant la récupération du 1er UL ( qui manque dans un coin ):

Code :

var sonsNode = lnkNode.parentNode.getElementsByTagName('*');
for( var j=0; j<sonsNode.length; j++){
if ( sonsNode[j].tagName == "UL" && sonsNode[j].className == "" ){
sonsNode[j].className = "disp";
/*** la tu peux meme sortir de la boucle en fait parce que "normalement" il ne peut en rester(enfin avoir) qu'un ***/
}
}

bixibu

Ca ... c'est fait!

Bon he ben je dois te remercier !
Tout marche parfaitement (sous mozilla ) et j'y serais jamais arrivé seul (et dieu sais que google est mon meilleur ami)

Je présente mon site demain, il va y avoir des gloussements ^^

Bon sinon pour IE, j'ai le 5.0 sur ma machine, pas le 5.5 dont tu m'as parlé. Mon probleme vient il de la d'apres toi ?

Sinon, le javascript en fait, c'est vraiment.. jouissif!

Code :

function setInputValue( obj, idInpText){
if( obj.value != 'titre'){
opener.document.getElementById(idInpText).innerHTML = obj.options[obj.selectedIndex].text;
opener.document.getElementById(idInpText).style.display = "block";
opener.document.getElementById("label_"+idInpText).style.display = "block";
window.close();
}
}

j'suis trop fier
Le label de ma div , je peut le récupérer sans doute plus proprement mais bon...

Allez Merci Encore pour le temps que tu as passé à m'aider.

Citation :

/*** la tu peux meme sortir de la boucle en fait parce que "normalement" il ne peut en rester(enfin avoir) qu'un ***/

Effectivement il ne m'en reste qu'un (de cheveu ) et je sort de la boucle a 17h Alleluya

FORUM HardWare.fr

Programmation

HTML/CSS

enieme sujet sur onchange / ListBox

Sujets relatifs
cocher automatiquement 1 checkbox en fonction des données d'1 listbox	Afficher dans une TextBox en fonction d'une ListBox
[HTML/CSS/Javascript] Select et onchange	[resolu] Listbox en paramètre d'une procédure
[Résolu] [Batch] [Newbies] Diverses questions au sujet du Batch	Encoder son mail avec sujet
merci de maider au sujet d'une newsletter	[Résolu] Probleme listbox + onclick
Au sujet de tout ce qui est inutilisé dans les .H	Le Fameux sujet du PathFinder
Plus de sujets relatifs à : enieme sujet sur onchange / ListBox

Page générée en 0.165 secondes