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

Recommended Answers

All 2 Replies

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

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.