TECHNOLOGIES
FORUMS
JOBS
BOOKS
EVENTS
INTERVIEWS
Live
MORE
LEARN
Training
CAREER
MEMBERS
VIDEOS
NEWS
BLOGS
Sign Up
Login
No unread comment.
View All Comments
No unread message.
View All Messages
No unread notification.
View All Notifications
Answers
Post
An Article
A Blog
A News
A Video
An EBook
An Interview Question
Ask Question
Forums
Monthly Leaders
Forum guidelines
Nidhi Donga
NA
88
8.7k
Delete Row is not working in below code.
Jul 29 2019 12:46 AM
<%@ Page Language=
"C#"
AutoEventWireup=
"true"
CodeBehind=
"test_table_dynamic.aspx.cs"
Inherits=
"Test_captcha.test_table_dynamic"
%>
<!DOCTYPE html>
<html xmlns=
"http://www.w3.org/1999/xhtml"
>
<head runat=
"server"
>
<title></title>
<link href=
"Content/bootstrap.css"
rel=
"stylesheet"
/>
<script src=
"Scripts/jquery-3.0.0.js"
></script>
<script src=
"Scripts/bootstrap.js"
></script>
<style>
body {
font-family:
'lato'
, sans-serif;
}
.container {
max-width: 1000px;
margin-left: auto;
margin-right: auto;
padding-left: 10px;
padding-right: 10px;
}
h2 {
font-size: 26px;
margin: 20px 0;
text-align: center;
}
h2 small {
font-size: 0.5em;
}
.responsive-table li {
border-radius: 3px;
padding: 25px 30px;
display: flex;
justify-content: space-between;
margin-bottom: 25px;
}
.responsive-table .table-header {
background-color: #95A5A6;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 0.03em;
}
.responsive-table .table-row {
background-color: #ffffff;
box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.1);
}
.responsive-table .col-1 {
flex-basis: 5%;
}
.responsive-table .col-2 {
flex-basis: 50%;
}
.responsive-table .col-3 {
flex-basis: 25%;
}
.responsive-table .col-4 {
flex-basis: 25%;
}
@media all and (max-width: 767px) {
.responsive-table .table-header {
display: none;
}
.responsive-table li {
display: block;
}
.responsive-table .col {
flex-basis: 100%;
}
.responsive-table .col {
display: flex;
padding: 10px 0;
}
.responsive-table .col:before {
color: #6C7A89;
padding-right: 10px;
content: attr(data-label);
flex-basis: 50%;
text-align: right;
}
}
</style>
<script type=
"text/javascript"
>
function
addRow(tableID) {
var
table = document.getElementById(tableID);
var
rowCount = table.rows.length;
var
row = table.insertRow(rowCount);
var
colCount = table.rows[0].cells.length;
for
(
var
i = 0; i < colCount; i++) {
var
newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
//alert(newcell.childNodes);
switch
(newcell.childNodes[0].type) {
case
"text"
:
newcell.childNodes[0].value =
""
;
break
;
case
"checkbox"
:
newcell.childNodes[0].checked =
false
;
break
;
case
"select-one"
:
newcell.childNodes[0].selectedIndex = 0;
break
;
}
}
}
function
deleteRow(tableID) {
try
{
var
table = document.getElementById(tableID);
var
rowCount = table.rows.length;
for
(
var
i = 0; i < rowCount; i++) {
var
row = table.rows[i];
var
chkbox = row.cells[0].childNodes[0];
if
(
null
!= chkbox &&
true
== chkbox.checked) {
if
(rowCount <= 1) {
alert(
"Cannot delete all the rows."
);
break
;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
}
catch
(e) {
alert(e);
}
}
</script>
</head>
<body>
<form id=
"form1"
runat=
"server"
>
<div
class
=
"container"
>
<h2>Sprinkler Irrigation Component's price <small></small></h2>
<ul
class
=
"responsive-table"
>
<li
class
=
"table-row"
>
<div
class
=
"col col-1"
data-label=
"Job Id"
>Email:</div>
<div
class
=
"col col-2"
data-label=
"Customer Name"
>
<asp:TextBox CssClass=
"form-control"
ID=
"c_email"
placeholder=
"Email"
runat=
"server"
></asp:TextBox>
</div>
<div
class
=
"col col-3"
data-label=
"Amount"
></div>
</li>
</ul>
</div>
<div
class
=
"container"
>
<ul
class
=
"responsive-table"
>
<li
class
=
"table-row"
>
<div
class
=
"col col-1"
data-label=
"Job Id"
>Nozzle</div>
<div
class
=
"col col-2"
>
<table id=
"dataTable"
class
=
"table-bordered table-hover table-striped table"
>
<tr>
<td>
<input type=
"checkbox"
name=
"chk"
/></td>
<td>
<asp:TextBox ID=
"TextBox1"
runat=
"server"
type=
"text"
placeholder=
"LPH"
></asp:TextBox></td>
<td>
<asp:TextBox ID=
"TextBox2"
runat=
"server"
type=
"text"
placeholder=
"RS./unit"
></asp:TextBox></td>
</tr>
</table>
</div>
<div
class
=
"col col-3"
></div>
<div
class
=
"col col-4"
>
<input type=
"button"
class
=
"btn btn-danger active"
value=
"Add Row"
onclick=
"addRow('dataTable')"
/><hr />
<input type=
"button"
class
=
"btn btn-info active"
value=
"Delete Row"
onclick=
"deleteRow('dataTable')"
/>
</div>
</li>
</ul>
</div>
</form>
</body>
</html>
In the above code i can insert the textbox by hitting add row button but delete row button is not working
Reply
Answers (
2
)
How to implement Telerik Control asp.net Application?
Session in web api.