I created a button for table cell using innerHTML. it is working perfectly in mozilla. But it is now working inn IE. Button is now displaying in IE. Please help me

You can do it this way:

<html>
<head>
<title></title>
<script type="text/javascript">
<!--
function createButton() {
var div = ( document.all ) ? document.all['myDiv'] : document.getElementById('myDiv');

div.innerHTML = '<button id="btn" name="btn">Button</button>'; 
}
//-->
</script>
</head>
<body>
<div id="myDiv" onclick="createButton();">Click Me!</div>
</body>
</html>

This is my HTML file

<tr align = "center">
<td><input type = "textbox" size = "40" value= "" id = "flag_name" name = "flag_name"></td>
<td><input type = "textbox" size = "40" value= "" id = "value" name = "value"></td>
<td><input type = "textbox" size = "40" value= "" id = "notes" name = "notes">
<input type="hidden" name="hidden" id="hidden" value=" "></td>

<td><input style="background-color:010280; color:white" type="button" value="+" onClick="addData(this.form)"></td> 
</tr>

This is script file for addData (i.e) Adding row to the tables;

function addData(form) {
        var addRow = document.getElementById('results').insertRow(1);
        document.getElementById("hidden").value = " "; 
        var flag_data = form.flag_name.value;
        var values_data = form.value.value;
        var notes_data = form.notes.value;

        var flagBox = addRow.insertCell(0);
        var valueBox = addRow.insertCell(1);
        var noteBox = addRow.insertCell(2);
        var removeButton = addRow.insertCell(3);
        var editButton = addRow.insertCell(4);

        addRow.className = "drawLine1"; 
        flagBox.className = "drawLine2"; 
        valueBox.className = "drawLine2"; 
        noteBox.className = "drawLine2"; 
        removeButton.className = "drawLine2"; 
        editButton.className = "drawLine2"; 

        flagBox.align = "center";
        valueBox.align = "center";
        noteBox.align = "center";
        removeButton.align = "center";
        editButton.align = "center";

        flagBox.innerHTML = flag_data;
        valueBox.innerHTML = values_data;
        noteBox.innerHTML = notes_data;

        removeButton.innerHTML = "<input style=\"background-color:010280; color:white\" type=\"button\" name=\"remove\" value=\"-\" onclick=\"deleteRow(this.parentNode.parentNode.rowIndex)>";

        form.flag_name.value = "";
        form.value.value = "";
        form.notes.value = "";

    }

The following command is used to create a button in the table.
It is working perfectly in mozilla. but not displaying the button in IE.

removeButton.innerHTML = "<input style=\"background-color:010280; color:white\" type=\"button\" name=\"remove\" value=\"-\" onclick=\"deleteRow(this.parentNode.parentNode.rowIndex)>";

Please help me

Edited 3 Years Ago by mike_2000_17: Fixed formatting

This article has been dead for over six months. Start a new discussion instead.