Probleme de creation d'une nouvelle option

Probleme de creation d'une nouvelle option - HTML/CSS - Programmation

Marsh Posté le 02-12-2003 à 21:47:16    

Bonjour,
 
Lorsque je cree une nouvelle option dans une select (jusque la tout va bien ;-) ).
 
Je peux recuperer la valeur de ma nouvelle option mais pas son nom .
 
Pour tester la recuperation du nom de cette option j'ai cree un fonction qui va m'afficher en me mettant sur l'option une alert avec sa valeur puis une autre qui va m'afficher son nom .
 
Malheureusement je recupere bien sa valeur mais pas le nom il m'affiche "undefined".
 
Voici le code :
 

Citation :

<html>
<head>
<script language="javascript">  
function TESTLIST()
{
var NBO
var VALA
var NAME
 
VAL=document.FORM1.liste.options[document.FORM1.liste.selectedIndex].value;
NAME=document.FORM1.liste.options[document.FORM1.liste.selectedIndex].name;
alert(VAL);
alert(NAME);
}  
</script>
<script language="javascript">
function Sports(form,list)
{
list.options.length=0;
var o=new Option("Tennis","Tennis",true, true );
form.liste.options[form.liste.options.length]=o;
var o=new Option("Basket Ball","Basket Ball",true, true );
form.liste.options[form.liste.options.length]=o;
}
</script>
 <title>Untitled</title>
</head>
<body>
<br/>
<form action="" name="FORM1">
<input type="radio" name="choix" value="Sports" OnClick="Sports(this.form,this.form.liste)">Sports
<select name="liste" align="top" size="6">
<option value="Liste vide">Liste vide...
</select>
<input type="button" value="TESTLIST" onclick="TESTLIST();">
</form>
</body>
</html>

 
 
 
 
   
 

Reply

Marsh Posté le 02-12-2003 à 21:47:16   

Reply

Marsh Posté le 03-12-2003 à 10:26:51    

Geulderack a écrit :

Bonjour,
 
Lorsque je cree une nouvelle option dans une select (jusque la tout va bien ;-) ).
 
Je peux recuperer la valeur de ma nouvelle option mais pas son nom .
 
Pour tester la recuperation du nom de cette option j'ai cree un fonction qui va m'afficher en me mettant sur l'option une alert avec sa valeur puis une autre qui va m'afficher son nom .
 
Malheureusement je recupere bien sa valeur mais pas le nom il m'affiche "undefined".
 
Voici le code :
 

Citation :

<html>
<head>
<script language="javascript">  
function TESTLIST()
{
var NBO
var VALA
var NAME
 
VAL=document.FORM1.liste.options[document.FORM1.liste.selectedIndex].value;
NAME=document.FORM1.liste.options[document.FORM1.liste.selectedIndex].name;
alert(VAL);
alert(NAME);
}  
</script>
<script language="javascript">
function Sports(form,list)
{
list.options.length=0;
var o=new Option("Tennis","Tennis",true, true );
form.liste.options[form.liste.options.length]=o;
var o=new Option("Basket Ball","Basket Ball",true, true );
form.liste.options[form.liste.options.length]=o;
}
</script>
 <title>Untitled</title>
</head>
<body>
<br/>
<form action="" name="FORM1">
<input type="radio" name="choix" value="Sports" OnClick="Sports(this.form,this.form.liste)">Sports
<select name="liste" align="top" size="6">
<option value="Liste vide">Liste vide...
</select>
<input type="button" value="TESTLIST" onclick="TESTLIST();">
</form>
</body>
</html>

 
 


 
 
Il manque pas un </option> ??

Reply

Marsh Posté le 03-12-2003 à 10:34:30    


var NBO
var VALA
var NAME
 
VAL=document.FORM1.liste.options[document.FORM1.liste.selectedIndex].value;
 
 
utilise le bon nom de variable.  
penses aussi à mettre quelques ';' par ci par là


Message édité par jagstang le 03-12-2003 à 10:35:41
Reply

Marsh Posté le 03-12-2003 à 10:55:58    

JagStang a écrit :


var NBO
var VALA
var NAME
 
VAL=document.FORM1.liste.options[document.FORM1.liste.selectedIndex].value;
 
 
utilise le bon nom de variable.  
penses aussi à mettre quelques ';' par ci par là


 
Maleureusement meme apres correction de mes variable et rajout de ; rien ne change tjs undefined !!!!
 
Je pige rien !!!

Reply

Marsh Posté le 03-12-2003 à 10:59:33    

Je redonne le code avec quelques correction :
 

Citation :

<html>
<head>
 <title>Untitled</title>
<script language="javascript">  
function TESTLIST()
{
var NBO;
var VAL;
var NAME;
NBO=document.FORM1.liste.length;
alert(NBO);
VAL=document.FORM1.liste.options[document.FORM1.liste.selectedIndex].value;
NAME=document.FORM1.liste.options[document.FORM1.liste.selectedIndex].name;
alert(VAL);
alert(NAME);
}  
</script>
<script language="javascript">
function Sports(form,list)
{
list.options.length=0;
var o=new Option("Tennis","Tennis",true, true );
form.liste.options[form.liste.options.length]=o;
var o=new Option("Basket Ball","Basket Ball",true, true );
form.liste.options[form.liste.options.length]=o;
}
</script>
</head>
<body>
<form action="" name="FORM1">
<input type="radio" name="choix" value="Sports" OnClick="Sports(this.form,this.form.liste)">Sports
<select name="liste" align="top" size="6">
<option value="Liste vide">Liste vide...</option>
</select>
<input type="button" value="TESTLIST" onclick="TESTLIST();">
</form>
</body>
</html>

Reply

Marsh Posté le 03-12-2003 à 11:01:20    

Ben y'a pas de nom !
 
Tu pense qu'il va te donner quoi ?
 
Si t'en veux un :
<option value="Liste vide" name="toto">Liste vide...</option>
 
Mais çà n'à pas un gros intérêt !
 
L'attribut name est utilisé comme identifiant coté serveur pour un champs de saisie. Pour une option çà n'a pas de sens.
 
En revanche, tu veux peut-être le texte de l'option. Alors la propriété est text.
 
Remarque Tu devrais donner des id à tes éléments. C'est plus propre pour y accéder en Javascript :
 

Code :
  1. <script language="javascript"> 
  2. function TESTLIST()
  3. {
  4. var l = document.getElementById('List_1');
  5. var o;
  6. if( l.selectedIndex >= 0 )
  7. {
  8. o = l.options[l.selectedIndex];
  9. alert( o.value );
  10. alert( o.text );
  11. }
  12. else
  13. {
  14. alert( "Pas d'option sélectionnée !" );
  15. }
  16. }
  17. </script>
  19. ...
  21. <select name="liste" align="top" size="6" id="List_1">
  22. <option value="Liste vide">Liste vide...</option>
  23. </select>


---------------
Laissez l'Etat dans les toilettes où vous l'avez trouvé.
Reply

Marsh Posté le 03-12-2003 à 11:26:28    

Mara's dad a écrit :

Ben y'a pas de nom !
 
Tu pense qu'il va te donner quoi ?
 
Si t'en veux un :
<option value="Liste vide" name="toto">Liste vide...</option>
 
Mais çà n'à pas un gros intérêt !
 
L'attribut name est utilisé comme identifiant coté serveur pour un champs de saisie. Pour une option çà n'a pas de sens.
 
En revanche, tu veux peut-être le texte de l'option. Alors la propriété est text.
 
Remarque Tu devrais donner des id à tes éléments. C'est plus propre pour y accéder en Javascript :
 

Code :
  1. <script language="javascript"> 
  2. function TESTLIST()
  3. {
  4. var l = document.getElementById('List_1');
  5. var o;
  6. if( l.selectedIndex >= 0 )
  7. {
  8. o = l.options[l.selectedIndex];
  9. alert( o.value );
  10. alert( o.text );
  11. }
  12. else
  13. {
  14. alert( "Pas d'option sélectionnée !" );
  15. }
  16. }
  17. </script>
  19. ...
  21. <select name="liste" align="top" size="6" id="List_1">
  22. <option value="Liste vide">Liste vide...</option>
  23. </select>




 
C'est le nom de la nouvelle option qu'il me faut et nom pas celle existante je te remet le code de creation de l'option  
 
new option("1er parametre" = Value , 2eme = Name)
 
Le texte m'importe peu en fait c'est vraiment le nom que je veux de plus sur des options deja cree au chargement j'arrive bien a recuperer leurs nom c'est seulement lorsque je cree une nouvelle option que j'ai un probleme alors je ne sais meme pas si il lui cree bien un nom ...
 
Merci  
 
 

Reply

Marsh Posté le 03-12-2003 à 11:40:33    

Non en fait c'est toi qui as raison Mea culpa je ne peux recuperer que le tex c'est pas grave je vais utiliser cela  
 
merci beaucoup ....

Reply

Marsh Posté le 03-12-2003 à 11:45:25    

Edit : Trop tard :D
 
Non, non et N O N !
 
Ce qui tu appelle nom n'est pas un attribut NAME !
 
Démo:
 

Code :
  1. <html>
  2. <form action="" name="FORM1">
  3. <select name="Liste" align="top" size="6" id="List_1"></select>
  4. <br>
  5. <textarea id="debug" rows="10" cols="100" ></textarea>
  6. </form>
  7. <script>
  8. var t = document.getElementById('debug');
  10. var l = document.getElementById('List_1');
  12. var o=new Option("Param 1","Param 2" );
  13. o.name='Nom qui sert à rien !';
  14. o.id='Id qui peut servir';
  16. l.options[l.options.length] = o;
  18. t.value = l.innerHTML + "\n\no.value = " + o.value + "\no.text = " + o.text + "\no.name = " + o.name + "\no.id = " + o.id;
  21. </script>
  22. </body>
  23. </html>


 
Essaye ce code dans ton navigateur et tu verras !


Message édité par Mara's dad le 03-12-2003 à 11:45:56

---------------
Laissez l'Etat dans les toilettes où vous l'avez trouvé.
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed