Блог

У меня есть список чекбоксов с парой элементов и опцией «все». Пользователь может выбрать все, и я хочу, чтобы это отключило все параметры, и если они снимут галочки со всех, это снимет галочки со всех параметров.

Я добился этого с помощью следующего кода.

 <script language="javascript" type="text/javascript">
    function CheckBoxListSelect(cbControl) //, state)
    {
        var chkBoxList = document.getElementById(cbControl);
        var chkBoxCount= chkBoxList.getElementsByTagName("input");

        alert(chkBoxCount[0].checked);

        for(var i=0;i<chkBoxCount.length;i  )
        {   
            chkBoxCount[i].checked = chkBoxCount[0].checked //state;
        }

        return false; 
    }
</script>

cblAffiliation.Attributes.Add("onclick", "javascript: CheckBoxListSelect ('" amp; cblAffiliation.ClientID amp; "');")
  

Проблема в том, что если я выбираю какой-либо из флажков, он перебирает их, а затем устанавливает для них любой параметр all. У меня возникли проблемы с поиском наилучшего способа обойти это.

Я хочу избежать использования флажка рядом со списком чекбоксов, тогда я должен составить эту строку в списке чекбоксов.

Просто проверьте, был ли флажок установлен для параметра «Все». Если это так, то продолжайте и измените остальные флажки. Если это не так, то проверьте все параметры, чтобы увидеть, все ли они отмечены, чтобы вы могли обновить флажок «Все».

Редактировать

Возможно, вы захотите использовать onChange вместо onClick, onClick, вероятно, будет вызван до изменения значения данного чекбокса.

Код не проверен, пожалуйста, простите за проблемы с синтаксисом.

 <script language="javascript" type="text/javascript">
    function CheckBoxListSelect(cbControl) //, state)
    {
        var chkBoxList = document.getElementById(cbControl);
        var chkBoxCount= chkBoxList.getElementsByTagName("input");
        var clicked = this;

        alert(chkBoxCount[0].checked ? 'All is Checked' : 'All is not Checked');
        alert(clicked == chkBoxCount[0] ? 'You Clicked All' : 'You Didn't click All');

        var AllChecked = true; // Check the all box if all the options are now checked

        for(var i = 1;i < chkBoxCount.length; i  )
        {   
            if(clicked == chkBoxCount[0]) { // Was the 'All' checkbox clicked?
                chkBoxCount[i].checked = chkBoxCount[0].checked; // Set if so
            }
            AllChecked amp;= chkBoxCount[i].checked; // AllChecked is anded with the current box
        }

        chkBoxCount[0].checked = AllChecked;

        return false; 
    }
</script>

cblAffiliation.Attributes.Add("onchange", "javascript: CheckBoxListSelect ('" amp; cblAffiliation.ClientID amp; "');")
  

Я думаю, этот код поможет вам.

 <script type="text/javascript">
function check(checkbox) 
{
 var cbl = document.getElementById('<%=CheckBoxList2.ClientID %>').getElementsByTagName("input");
 for(i = 0; i < cbl.length;i  ) cbl[i].checked = checkbox.checked;
}
</script>

 <asp:CheckBox ID="CheckBox1" runat="server" onclick="check(this)" />
 <asp:CheckBoxList ID="CheckBoxList2" runat="server">
    <asp:ListItem>C1</asp:ListItem>
    <asp:ListItem>C2</asp:ListItem>
  </asp:CheckBoxList>
  

  <asp:CheckBox ID="checkAll" runat="server" Text="Select/Unselect" onclick="CheckAll();" />
    <asp:CheckBoxList ID="chkTest" runat="server" onclick="ClearAll();">
        <asp:ListItem Text="Test 1" Value="0"></asp:ListItem>
        <asp:ListItem Text="Test 2" Value="1"></asp:ListItem>
        <asp:ListItem Text="Test 3" Value="2"></asp:ListItem>
            </asp:CheckBoxList>
<script type="text/javascript">

function CheckAll() {
    var intIndex = 0;
    var rowCount=document.getElementById('chkTest').getElementsByTagName("input").length;
    for (intIndex = 0; intIndex < rowCount; intIndex  ) 
    {
        if (document.getElementById('checkAll').checked == true)
        {
            if (document.getElementById("chkTest"   "_"   intIndex)) 
            {
                if (document.getElementById("chkTest"   "_"   intIndex).disabled != true)
                    document.getElementById("chkTest"   "_"   intIndex).checked = true;
            }
         }
         else
         {
             if (document.getElementById("chkTest"   "_"   intIndex)) 
                {
                    if (document.getElementById("chkTest"   "_"   intIndex).disabled != true)
                        document.getElementById("chkTest"   "_"   intIndex).checked = false;
                }
         }
    }
 } 

function ClearAll(){
    var intIndex = 0;
    var flag = 0;
    var rowCount=document.getElementById('chkTest').getElementsByTagName("input").length;
    for (intIndex = 0; intIndex < rowCount; intIndex  ) 
    {
            if (document.getElementById("chkTest"   "_"   intIndex)) 
            {
                    if(document.getElementById("chkTest"   "_"   intIndex).checked == true)
                    {
                        flag=1;
                    }
                    else
                    {
                        flag=0;
                        break;
                    }
            }
    }
    if(flag==0)
         document.getElementById('checkAll').checked = false;
    else
         document.getElementById('checkAll').checked = true;

}
</script>
  

  function checkparent(id) {
            var parentid = id;
            var Control = document.getElementById(parentid).getElementsByTagName("input");
            if (parentid.indexOf("List") != -1) {
                parentid = parentid.replace("List", "");
            }
            if (eval(Control).length > 0) {
                if (eval(Control)) {

                    for (var i = 0; i < Control.length; i  ) {
                        checkParent = false;
                        if (Control[i].checked == true) {
                            checkChild = true;
                        }
                        else {

                            checkChild = false;
                            break;
                        }
                    }
                }
            }
            if (checkParent == true amp;amp; document.getElementById(parentid).checked == false) {
                document.getElementById(parentid).checked = false;
                checkParent = true;
            }
            else if (checkParent == true amp;amp; document.getElementById(parentid).checked == true) {
                document.getElementById(parentid).checked = true;
                checkParent = true;
            }
            if (checkChild == true amp;amp; checkParent == false) {
                document.getElementById(parentid).checked = true;
                checkParent = true;
            }
            else if (checkChild == false amp;amp; checkParent == false) {
                document.getElementById(parentid).checked = false;
                checkParent = true;
            }

        }
        function CheckDynamic(chkid) {
            id = chkid.id;
            var chk = $("#"   id   ":checked").length;
            var child = id   "List";
            if (chk != 0) {
                $("[id*="   child   "] input").attr("checked", "checked");
            }
            else {
                $("[id*="   child   "] input").removeAttr("checked");
            }
            checkparent(id);
        }