Selection of and Unclick the CheckBox Controls in ASP.NET

Aspx Code


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

    <title></title>

    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">

    <script language="javascript">

 

        function ChkAllClick(sonName, cbAllId) {

            var arrSon = document.getElementsByName(sonName);

            var cbAll = document.getElementById(cbAllId);

            var tempState = cbAll.checked;

            for (i = 0; i < arrSon.length; i++) {

                if (arrSon[i].checked != tempState)

                    arrSon[i].click();

            }

        }

 

        function ChkSonClick(sonName, cbAllId) {

            var arrSon = document.getElementsByName(sonName);

            var cbAll = document.getElementById(cbAllId);

            for (var i = 0; i < arrSon.length; i++) {

                if (!arrSon[i].checked) {

                    cbAll.checked = false;

                    return;

                }

            }

            cbAll.checked = true;

        }

 

        function ChkOppClick(sonName) {

            var arrSon = document.getElementsByName(sonName);

            for (i = 0; i < arrSon.length; i++) {

                arrSon[i].click();

            }

        }

    </script>

</head>

<body>

    <form name="form1" method="post" action="">

    <table width="500" border="1">

        <tr bgcolor="#FFFF66">

            <td>

                <input name="chkAll" id="chkAll" title="??" onclick="ChkAllClick('chkSon','chkAll')"

                    type="checkbox" />??

            </td>

            <td align="center">

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

        </tr>

        <tr>

            <td>

                <input name="chkSon" id="chkSon1" type="checkbox" value='1' onclick="ChkSonClick('chkSon','chkAll')" />1

            </td>

            <td>

                ??:

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

        </tr>

        <tr>

            <td>

                <input name="chkSon" id="chkSon2" type="checkbox" value='2' onclick="ChkSonClick('chkSon','chkAll')" />2

            </td>

            <td>

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

        </tr>

        <tr>

            <td>

                <input name="chkSon" id="chkSon3" type="checkbox" value='3' onclick="ChkSonClick('chkSon','chkAll')" />3

            </td>

            <td>

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

        </tr>

        <tr>

            <td>

                <input name="chkSon" id="chkSon4" type="checkbox" value='4' onclick="ChkSonClick('chkSon','chkAll')" />4

            </td>

            <td>

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

        </tr>

        <tr>

            <td>

                <input name="chkSon" id="chkSon5" type="checkbox" value='5' onclick="ChkSonClick('chkSon','chkAll')" />5

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

        </tr>

        <tr>

            <td>

                <input name="chkSon" id="chkSon6" type="checkbox" value='6' onclick="ChkSonClick('chkSon','chkAll')" />6

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

        </tr>

        <tr>

            <td>

                <input name="chkSon" id="chkSon8" type="checkbox" value='8' onclick="ChkSonClick('chkSon','chkAll')" />8

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

        </tr>

        <tr>

            <td>

                <input name="chkSon" id="chkSon10" type="checkbox" value='10' onclick="ChkSonClick('chkSon','chkAll')" />10

            </td>

            <td>

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

        </tr>

        <tr bgcolor="#66FFFF">

            <td>

                <input name="chkOpposite" id="chkOpposite" title="??" onclick="ChkOppClick('chkSon')"

                    type="checkbox" />??

            </td>

            <td align="center">

            </td>

            <td>

                &nbsp;

            </td>

            <td>

                &nbsp;

            </td>

        </tr>

    </table>

    </form>

</body>

</html>