zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    [转载]企业级服务器设计与实现经验之系统框架(一)
    【转载】es通信框架
    【转载】企业级服务器设计与实现经验之插件系统基础篇
    阻塞队列
    [转载]ESFramework 4.0 进阶(01)-- 消息
    心跳监测器 IHeartBeatChecker
    poj2470
    poj2478
    poj2418
    poj2481
  • 原文地址:https://www.cnblogs.com/philzhou/p/1793554.html
Copyright © 2011-2022 走看看