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
>