try the below code:
HTML & javascript code:
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title></title>
<style>
.highlight {
background-color: red;
color: white;
}
</style>
<script>
function abc(index) {
var rr = document.getElementsByClassName("highlight");
for (var i = 0; i < rr.length; i++) {
rr[i].className = rr[0].className.replace("highlight", "");
}
var ss = document.getElementById(index);
ss.className = "highlight";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
Creating a dyanamic Table
<tr>
<td>Row:
<asp:TextBox ID="txtrow" placeholder="No of Rows Here" runat="server" AutoCompleteType="Disabled"></asp:TextBox>
<br />
<br />
</td>
</tr>
<tr>
<td>Coloum:
<asp:TextBox ID="txtcol" placeholder="No of Coloums Here" runat="server" AutoCompleteType="Disabled"></asp:TextBox>
<br />
<br />
</td>
</tr>
<tr>
<td>
<asp:Button ID="Button1" Text="Create Table" runat="server" CssClass="button1" OnClick="Button1_Click" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
code behind code:
protected void Button1_Click(object sender, EventArgs e)
{
CreateDynamicTable();
}
private void CreateDynamicTable()
{
int rowCnt;
int cellCnt;
int rowCtr;
int cellCtr;
Table Table1 = new Table();
Table1.BorderWidth = 3;
Table1.BorderStyle = BorderStyle.Solid;
Table1.ID = "myTable";
rowCnt = int.Parse(txtrow.Text);
cellCnt = int.Parse(txtcol.Text);
for (rowCtr = 1; rowCtr <= rowCnt; rowCtr++)
{
TableRow tRow = new TableRow();
Table1.Rows.Add(tRow);
for (cellCtr = 1; cellCtr <= cellCnt; cellCtr++)
{
TableCell tCell = new TableCell();
tRow.Cells.Add(tCell);
string prodID = rowCtr + "_" + cellCtr;
TextBox txtbox = new TextBox();
txtbox.Text = "Row:" + rowCtr + " Column:" + " " + cellCtr;
txtbox.Attributes.Add("id", prodID);
txtbox.Attributes.Add("onfocus", "abc('" + prodID + "')");
tCell.Controls.Add(txtbox);
tRow.Controls.Add(tCell);
}
Table1.Rows.Add(tRow);
}
form1.Controls.Add(Table1);
}