javascript Check All, Uncheck All and check one at least
Use javascript to checked all,uncheck all and check if one item at least been checked when deleting.
代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>JSRepeaterCheckBox</title>
<script language="javascript">
function CheckCount() {
var checks = document.getElementsByTagName('input');
for (var i = 0; i < checks.length; i++) {
if (checks[i].type == 'checkbox') {
if (checks[i].checked == true) {
return true;
}
}
}
alert('Please select one item at list!');
return false;
}
function CheckAll() {
var checks = document.getElementsByTagName('input');
var checkAllObject = document.getElementById('checkAllItem');
var status = checkAllObject.checked;
for (var i = 0; i < checks.length; i++) {
if (checks[i].type == 'checkbox') {
checks[i].checked = status;
}
}
// return true;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Repeater ID="rptAppliant" runat="server" DataSourceID="SqlDataSource1" >
<HeaderTemplate>
<table>
<th>ID</th><th>Name</th><th><input type="checkbox" id="checkAllItem" name="checkAll" onclick="CheckAll()" /></th>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td><%#Eval("id") %></td>
<td ><%#Eval("Name") %></td>
<td><asp:CheckBox runat="server" ID="ckb" /></td>
</tr>
</ItemTemplate>
<FooterTemplate></table></FooterTemplate>
</asp:Repeater>
<div><asp:Button runat="server" Text="Delete" OnClientClick="return CheckCount();" /></div>
</div>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
SelectCommand="SELECT * FROM [Appliant]"></asp:SqlDataSource>
</form>
</body>
</html>
The target html generated by iis is as blow:
代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
JSRepeaterCheckBox
</title>
<script language="javascript">
function CheckCount() {
var checks = document.getElementsByTagName('input');
for (var i = 0; i < checks.length; i++) {
if (checks[i].type == 'checkbox') {
if (checks[i].checked == true) {
return true;
}
}
}
alert('Please select one item at list!');
return false;
}
function CheckAll() {
var checks = document.getElementsByTagName('input');
var checkAllObject = document.getElementById('checkAllItem');
var status = checkAllObject.checked;
for (var i = 0; i < checks.length; i++) {
if (checks[i].type == 'checkbox') {
checks[i].checked = status;
}
}
// return true;
}
</script>
</head>
<body>
<form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTExNjU5ODUwMzYPZBYCAgMPZBYCAgEPFgIeC18hSXRlbUNvdW50AgYWDAIBD2QWAmYPFQIBMQlXYXNoaW50b25kAgIPZBYCZg8VAgEyBEJ1c2hkAgMPZBYCZg8VAgEzBUxhbmN5ZAIED2QWAmYPFQIBNAdHb2xkbWFuZAIFD2QWAmYPFQIBNQNKaW1kAgYPZBYCZg8VAgE2BEthdGVkGAEFHl9fQ29udHJvbHNSZXF1aXJlUG9zdEJhY2tLZXlfXxYGBRVycHRBcHBsaWFudCRjdGwwMSRja2IFFXJwdEFwcGxpYW50JGN0bDAyJGNrYgUVcnB0QXBwbGlhbnQkY3RsMDMkY2tiBRVycHRBcHBsaWFudCRjdGwwNCRja2IFFXJwdEFwcGxpYW50JGN0bDA1JGNrYgUVcnB0QXBwbGlhbnQkY3RsMDYkY2tibHrakvFGc4n+fTnFVQMpA2tStXo=" />
</div>
<div>
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWCAKcs6y5BALn1abPBgLE1KbPBgKh1qbPBgL+1KbPBgLj1KbPBgLA06bPBgKfwImNCx8u9urjhh+8kC/RRzFaRFN/1r3G" />
</div>
<div>
<table>
<th>ID</th><th>Name</th><th><input type="checkbox" id="checkAllItem" name="checkAll" onclick="CheckAll()" /></th>
<tr>
<td>1</td>
<td >Washinton</td>
<td><input id="rptAppliant_ctl01_ckb" type="checkbox" name="rptAppliant$ctl01$ckb" /></td>
</tr>
<tr>
<td>2</td>
<td >Bush</td>
<td><input id="rptAppliant_ctl02_ckb" type="checkbox" name="rptAppliant$ctl02$ckb" /></td>
</tr>
<tr>
<td>3</td>
<td >Lancy</td>
<td><input id="rptAppliant_ctl03_ckb" type="checkbox" name="rptAppliant$ctl03$ckb" /></td>
</tr>
<tr>
<td>4</td>
<td >Goldman</td>
<td><input id="rptAppliant_ctl04_ckb" type="checkbox" name="rptAppliant$ctl04$ckb" /></td>
</tr>
<tr>
<td>5</td>
<td >Jim</td>
<td><input id="rptAppliant_ctl05_ckb" type="checkbox" name="rptAppliant$ctl05$ckb" /></td>
</tr>
<tr>
<td>6</td>
<td >Kate</td>
<td><input id="rptAppliant_ctl06_ckb" type="checkbox" name="rptAppliant$ctl06$ckb" /></td>
</tr>
</table>
<div><input type="submit" name="ctl02" value="Delete" onclick="return CheckCount();" /></div>
</div>
</form>
</body>
</html>
