SELECT OPTION SELECTED kécako ???

Résolu

nyco2222 -
Jbco - 17 sept. 2008 à 14:45

Bonjour,

Voila cela fait un bon moment que je cherche à optimiser ce code hyper pratique pour faire des menus déroulants dynamiques en javascript.

Le code fonctionne mais je n'arrive pas à sélectionner PAR DEFAUT un élément dans la liste en utilisant l'objet SELECTED comme on fait d'habitude avec HTML. Comme ce code est généré dynamqiuement je ne sais pas comment ajouter cette fonction....
merci d'éclairer ma lenterne pour ceux qui y arrive !!!!!!

Avec mes remerciements,

Nyco

Le javascript:

function fillCategory(){ 
 // this function is used to fill the category list on load
addOption(document.drop_list.Category, "Fruits", "Fruits", "");
addOption(document.drop_list.Category, "Games", "Games", "");
addOption(document.drop_list.Category, "Scripts", "Scripts", "");
}

function SelectSubCat(){
// ON selection of category this function will work

removeAllOptions(document.drop_list.SubCat);
addOption(document.drop_list.SubCat, "", "SubCat", "");

if(document.drop_list.Category.value == 'Fruits'){
addOption(document.drop_list.SubCat,"Mango", "Mango");
addOption(document.drop_list.SubCat,"Banana", "Banana");
addOption(document.drop_list.SubCat,"Orange", "Orange");
}
if(document.drop_list.Category.value == 'Games'){
addOption(document.drop_list.SubCat,"Cricket", "Cricket");
addOption(document.drop_list.SubCat,"Football", "Football");
addOption(document.drop_list.SubCat,"Polo", "Polo", "");
}
if(document.drop_list.Category.value == 'Scripts'){
addOption(document.drop_list.SubCat,"PHP", "PHP");
addOption(document.drop_list.SubCat,"ASP", "ASP");
addOption(document.drop_list.SubCat,"Perl", "Perl");
}

}
////////////////// 

function removeAllOptions(selectbox)
{
	var i;
	for(i=selectbox.options.length-1;i>=0;i--)
	{
		//selectbox.options.remove(i);
		selectbox.remove(i);
	}
}


function addOption(selectbox, value, text )
{
	var optn = document.createElement("OPTION");
	optn.text = text;
	optn.value = value;

	selectbox.options.add(optn);
}

le HTML:

<!doctype html public "-//w3c//dtd html 3.2//en">
<html>
<head>
<title>(Type a title for your page here)</title>
<script language="javascript" src="list.js"></script>
</head>

<body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000" onload="fillCategory();">

<FORM name="drop_list" action="yourpage.php" method="POST" >
		
<SELECT  NAME="Category" onChange="SelectSubCat();" >
<Option value="">Category</option>
</SELECT> 
<SELECT id="SubCat" NAME="SubCat">
<Option value="">SubCat</option>
</SELECT>
</form>

</body>

</html>

Afficher la suite

A voir également:

SELECT OPTION SELECTED kécako ???
Option d'ergonomie - Guide
Option volte/vowifi - Guide
Insert boot media in selected boot device and press a key ✓ - Forum Windows 10
Reboot and select proper boot device or insert boot media in selected boot device and press a key - Forum Windows
Selected file is not a proper bios ✓ - Forum Windows 10

4 réponses

Réponse 1 / 4

Jbco

Bonjour à tous

je sais pas si tu en as encore besoin mais voici ta solution. En effet elle est plus que simple mais on peut comprendre que tu n'es pas programmeur.

function SelectSubCat(){
// ON selection of category this function will work

removeAllOptions(document.drop_list.SubCat);
addOption(document.drop_list.SubCat, "", "SubCat", "");

if(document.drop_list.Category.value == 'Fruits'){
addOption(document.drop_list.SubCat,"Mango", "Mango");
addOption(document.drop_list.SubCat,"Banana", "Banana");
addOption(document.drop_list.SubCat,"Orange", "Orange");
document.drop_list.SubCat.value = "Orange";
}
if(document.drop_list.Category.value == 'Games'){
addOption(document.drop_list.SubCat,"Cricket", "Cricket");
addOption(document.drop_list.SubCat,"Football", "Football");
addOption(document.drop_list.SubCat,"Polo", "Polo", "");
}
if(document.drop_list.Category.value == 'Scripts'){
addOption(document.drop_list.SubCat,"PHP", "PHP");
addOption(document.drop_list.SubCat,"ASP", "ASP");
addOption(document.drop_list.SubCat,"Perl", "Perl");
}

}

Ca c'est la version basique. Le mieux étant de rajoutant 1 paramètre à la fonction addOption qui sera une sorte de booléen (0 ou 1) pour lui indiquer si la nouvelle option sera celle sélectionnée ou pas. Ci-dessous les deux fonctions avec les rajouts en italique-souligné-gras :

function SelectSubCat(){
// ON selection of category this function will work

removeAllOptions(document.drop_list.SubCat);
addOption(document.drop_list.SubCat, "", "SubCat", """, 0);

if(document.drop_list.Category.value == 'Fruits'){
addOption(document.drop_list.SubCat,"Mango", "Mango", 1);
addOption(document.drop_list.SubCat,"Banana", "Banana", 0);
addOption(document.drop_list.SubCat,"Orange", "Orange", 0);
}
if(document.drop_list.Category.value == 'Games'){
addOption(document.drop_list.SubCat,"Cricket", "Cricket", 1);
addOption(document.drop_list.SubCat,"Football", "Football", 0);
addOption(document.drop_list.SubCat,"Polo", "Polo", "", 0);
}
if(document.drop_list.Category.value == 'Scripts'){
addOption(document.drop_list.SubCat,"PHP", "PHP", 0);
addOption(document.drop_list.SubCat,"ASP", "ASP", 1);
addOption(document.drop_list.SubCat,"Perl", "Perl", 0);
}

}

function addOption(selectbox, value, text, txt_selected)
{
	var optn = document.createElement("OPTION");
	optn.text = text;
	optn.value = value;

	selectbox.options.add(optn);
if(txt_selected==1){
		selectbox.value = optn.text;
	}
}

Bon prog' !
Jbco

Réponse 2 / 4

Reivax962 Messages postés 3672 Date d'inscription Statut Membre Dernière intervention 1 011

Si tu n'avais pas fait l'impatient au bout de seulement 3 minutes (!!), je t'aurais surement répondu, car ce n'est pas très compliqué.

Réponse 3 / 4

nyco2222

Désolé de 'avoir fait l'impatient mais je te jusre que la la page elle commence à me sortir de partout ... je la transpire même...
je sais que ce n'est pas compliqué à résoudre mais moi tu vois j suis designer à la base pas programmeur ... du coup le code ca me rend nerveux .

:D

mais tu vois pendant ce temps la je répond à d'autres questions qui sont justement à ma portée EG graphisme, 3d, etc ...
mais bon .

Merci à toi si tu as toujours le temps de répondre !!

Nyco

Réponse 4 / 4

nyco2222

Alors les copains vous n'êtent pas la aujours hui ??

Discussions similaires

Aide Please select boot device

Select boot device première utilisation

Please select boot device

Reboot and select proper boot device

Option de connexion est désactivé sur pc HP

Votre réponse

Discussions similaires