Changer une balise select en JS
Changer une balise select en JS - HTML/CSS - Programmation
Marsh Posté le 30-05-2007 à 00:28:17
Ca va surtout foirer, documente toi sur new Option()
---------------
Mains power can kill, and it will hurt the entire time you’re dying from it.
Marsh Posté le 30-05-2007 à 12:13:16
et pourquoi donc ?
parce que en ajoutant un option à mon select2 cela fonctionne bien en faisant :
sel.appendChild(opt); |
Le principe doit donc etre bon avec document.createElement("option" ) pour contruire l'element option.
Le problème vient du remplacement avec replaceChild
Sinon j'ai essayé de trouvé new Option mais j'ai rien trouvé dans la doc de Mozilla et pourtant ils énumèrent je pense tout les objets dom possible
http://developer.mozilla.org/fr/do [...] _DOM_Gecko
Message édité par weed le 30-05-2007 à 12:13:54
Marsh Posté le 30-05-2007 à 12:30:01
Ta première méthode va péter sous IE.
Ta deuxième méthode sent l'avoine.
http://www.quirksmode.org/js/options.html
---------------
Mains power can kill, and it will hurt the entire time you’re dying from it.
Sujets relatifs:
- [Mysql] Changer l'ordre des champs d'une table
- [HTML/JavaScript] Effacer la sélection d'un select multiple
- Affichage balise
- Changer l'expediteur d'un mail
- Existe t-il une balise qui fasse l'inverse de <noscript>
- changer les couleurs ds devc++
- [APACHE2]Changer l'accés au page
- Problème select
- Nombre de résultat d'un select
- [SQL] select avec date
Marsh Posté le 30-05-2007 à 00:06:58
Bonjour,
j'ai 2 select : select1 et select2. En fonction du contenu de select1, le contenu du select2 change.
select2 prend ce contenu si select1 vaut "now"
<select name='select2' id='select2'>
<option value='t1'>v1</option>
<option value='t2'>v2</option>
<option value='t3'>v3</option>
</select>
sinon :
<select name='select2' id='select2'>
<option value='H1'>M1</option>
<option value='H2'>M2</option>
</select>
La fonction JS est appelé de cette facon :
<select name='select1' onchange="histo(this.value)" id="select1">
Plusieurs solution s'offre à moi. Sois je change le contenu html de la balise <select> avec un innerHTM.
Ce n'est pas la méthode la plus élégante mais la plus rapide à executer.
sel=document.getElementById("action" );
if (v == "now" )
{
sel.innerHTML = "<option value='t1'>v1</option><option value='t2'>v2</option><option value='t3'>v3</option>";
}
else
{
sel.innerHTML = "<option value='H1'>M1</option><option value='H2'>M2</option>";
}
Sinon il y a l'autre méthode. De creer manuellement les noeuds et de remplacer les anciens par les nouveaux. Les noeuds restants sont supprimer. Dans mon cas, mon select a soit 3 balise option ou soit 2 balise option.
Cette méthode doit etre plus lente car il faut recreer les elements puis les remplacer par les anciens alors qu'avec le innerHTML, meme si c'est pas joli pour certains d'entre vous, il y a juste 1-2 instructions à executer donc normallement beaucoup plus rapide.
Qu'en pensez vous ?
J'ai quand meme essaye de creer mes élements mais je n'y arrive pas. Ca fait planter mon navigateur. J'ai du merder quelques part au niveau du remplacement.
if (v == "now" )
{
//Creation de la balise option
opt = document.createElement("option" );
//Creation de son attrbue value
opt.setAttribute("value","t1" );
// On crée du contenu pour le nouvel élément
var opt_content = document.createTextNode("v1" );
// On applique ce contenu au nouvel élément
opt.appendChild(opt_content);
//reférence de l'ancienne balise du premier enfant de select2
var opt_old = sel.firstChild
//on remplace la référence de l'ancienne balise option par la nouvelle
sel.replaceChild(opt,sel.opt_old);
}