In my html file i have the following:
<td id="trainers_rowC1">Trainer1</td>
<td><input type="button" id="edit_button1" value="Edit" class="edit" onclick="edit_rowC('1')"></td>
In my JavaScript file i have this function:
function edit_rowC(no) {
var trainers = document.getElementById("trainers_rowC" + no);
var trainers_data = trainers.innerHTML;
trainers.innerHTML = "<select id ='trainers_options" + no + "'><option value='" + trainers_data + "'>";
}
But when i press the Edit button the dropdown menu is empty. What is the mistake?
This works for me.
Your mistake was that you tried to set the content of the option tag with value="...". But you have to write it between the two tags. --> <option>" + test + "</option>
function edit_rowC(no) {
var test = document.getElementById("trainers_rowC" + no).innerHTML;
document.getElementById("trainers_rowC" + no).innerHTML = "<td><select id ='trainers_options" + no + "'><option>" + test + "</option><option>test</option></select></td>";
}
There doesn't seem to be any closing tags in the assignment of trainers.innerHTML - could that be it?