11545 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Liste déroulante et boucle

Coucou

Je voudrais afficher une liste déroulante avec les éléments d'une boucle à l'intérieur. Mais j'y arriver pas, je galère complétos; voici mon bout de code

for (var elem in datas) {
var tmp = datas Smiley elem .split("#");
var title = tmp[0];
$("#remplacer").append(title);
}

J'ai essayé ,
$("#remplacer").append("<select>");

for (var elem in datas) {
var tmp = datas Smiley elem .split("#");
var title = tmp[0];
$("#remplacer").append("<option>" + title + "</option>");
}

$("#remplacer").append("</select>");

Si quelqu'un avait une idée. Merci Smiley decu
Salut,

Tu ajoutes ton select à #remplacer. Puis tu lui ajoutes également tes options.
Du coup, si ton tableau, boucle et toussa fonctionnent bien, tu vas obtenir ceci :
<div id="remplacer">
    <select></select>
    <option>title</option>
    <option>title</option>
    <option>title</option>
    </select> <!-- qui génère peut-être une erreur également -->
</div>

à la place de 
<div id="remplacer">
    <select>
        <option>title</option>
        <option>title</option>
        <option>title</option>
    </select>
</div>


Solutions :
- Soit tu concatènes ton "html" actuel et puis, avec un seul .append(), tu l'ajoutes à #remplacer (la plus performante)
- Soit tu crées ton noeud dom "select" auquel tu "append" toutes tes <option> avant d'"appender" l'ensemble à #remplacer...

tm
Oui MERCI beaucoup. En effet j'ai fait

$("#remplacer").append(<select id='selectDate'>);

for (var elem in datas) {
var tmp = datas Smiley elem .split("#");
var title = tmp[0];
$("#remplacer").append($("#selectDate").append($("<option>").attr("value",title ).text(title)));
}
$("#remplacer").append(</select>);

Et ça marche. Smiley lol
Cool si ça marche.
Super cool si c'est aussi un peu optimisé ? Smiley cligne

Perso, je limiterais les manipulations du DOM en faisant ainsi : 
var select = '<select id="selectDate">';
for (var elem in datas) {
   var tmp = datas.elem.split("#");
   var title = tmp[0];
   select += '<option value="' + title + '>' + title + '</option>';
}
$("#remplacer").append(select);


tm
Sujet clos
Aller à