how to add a drop down list to a <span> using javascript

Question

html part:

<body onload="init();firstInit();">

script part:

function init(){
var tb = new Ext.Toolbar({
renderTo: 'toolbar',
height: 25
});             
var ht='<table><tr>';
ht+='<td>';
ht+='<div class="font">Mode : </div>';
ht+='</td>';
ht+='<td id="visumode.container">';
ht+='<select id="visuMode.select" size="1" onchange="fRefresh();">';
ht+='<option value="Direct">Direct</option>';               
ht+='</select>';
ht+='</td>';
ht+='</tr></table>';
span = document.createElement("span");
span.innerHTML=  ht;
tb.addElement(span);
}
function firstInit(){
var d document.getElementById("visumode.container");
alert(d)
}

this is a small part of the code, in the html part the result are put in a form. the alert is null why?

First off, i wouldn't add a select element (block element) to a span element (inline element), why not just add it to a div. You also don't do anything with the resulting span element, add it to a container or return it from the function and then add it to your DOM. — Bas Tuijnman
– Bas Tuijnman, Commented Dec 15, 2014 at 9:37
thank you for your fast reply i will edit my question with the real code. — leb
– leb, Commented Dec 15, 2014 at 9:44
@BasTuijnman Select is not a block level element. So, putting it in a span is not wrong. Just depends where the span is supposed to be inserted. — René
– René, Commented Dec 15, 2014 at 9:44
@René You're right, it is indeed not a block element, still dont like the semantics though :) — Bas Tuijnman
– Bas Tuijnman, Commented Dec 15, 2014 at 9:46
In your updated code(really annoying that you updated your question with so much...) var d document... should be var d = document.... Next time mark an answer as accepted and create a new question instead of changing your entire question. — René
– René, Commented Dec 15, 2014 at 9:58

Paul Lo · Accepted Answer · 2014-12-15 09:36:55Z

2

You don't have closing tag: </select> for ht, and the span variable is not added to the DOM.

answered Dec 15, 2014 at 9:36

Paul Lo

6,1466 gold badges33 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

leb Over a year ago

thank you for your fast reply i will edit my question with the real code.

Cerbrus · Accepted Answer · 2014-12-15 09:35:52Z

2

You create a span element, but then you don't do anything with it.

You'll need to add span to the document, somewhere:

<div id="myContainer"></div>

document.getElementById('myContainer').appendChild(span);

You'll also want to add a closing tag to your select:

ht += '</select>';

answered Dec 15, 2014 at 9:35

Cerbrus

73.3k19 gold badges138 silver badges151 bronze badges

1 Comment

leb Over a year ago

thank you for your fast reply i will edit my question with the real code.

Collectives™ on Stack Overflow

how to add a drop down list to a <span> using javascript

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related