I have this problem with the code:
- Code: Select all
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script>
function addEvent() {
var ni = document.getElementById('myDiv');
var numi = document.getElementById('theValue');
var num = (document.getElementById("theValue").value -1)+ 2;
numi.value = num;
var divIdName = "my"+num+"Div";
var newdiv = document.createElement('div');
newdiv.setAttribute("id",divIdName);
newdiv.innerHTML = "<input type='text' value='' id='theValue' /> <a href=\"javascript:;\" onclick=\"removeElement(\'"+divIdName+"\')\">Remove the element ""+divIdName+""</a>";
ni.appendChild(newdiv);
}
function removeElement(divNum) {
var d = document.getElementById('myDiv');
var olddiv = document.getElementById(divNum);
d.removeChild(olddiv);
}
</script>
</head>
<body>
<input type="hidden" value="0" id="theValue" />
<p><a href="javascript:;" onClick="addEvent();">Add Some Elements</a></p>
<div id="myDiv"> </div>
</body>
</html>
This is working fine. It writes a textfield and a delete link.
But I want to add a select menu after the textfield like this:
- Code: Select all
newdiv.innerHTML = '<input type="text" value="" id="theValue" /><select name='menu1' id='menu1' style='width: 300px;'>
<option value='Food'>Food</option>
<option value='Wine'>Wine</option>
</select><a href=\'#\' onclick=\'removeElement('+divIdName+')\'>Remove the div "'+divIdName+'"</a>';
This is not working, and I don't know why. Do you see anything wrong with the code above?
Thnx!
