如何取消选中全部选中复选框，当一个复选框未选中

1

您可以在客户端或服务器端上做到这一点

客户端使用javascript/jQuery的侧

由于复选框被动态地添加你需要使用on方法将复选框绑定到函数并在状态发生变化时将其解雇。

$(document).ready(function() { 
    $(".checkbox").on("change", function() { 
     if(!$(this).is(":checked")){ 
      $(".selectAll").prop('checked', false); 
     } 
    }); 
});

这是一个带全功能一jsFiddle选择所有将：

全部选择/取消所有
打钩选择全部，当其中一个复选框是取消选中
蜱选择所有当所有复选框被勾选时

服务器端

使用的事件处理程序就回发（AJAX）当一个复选框是通过所有的复选框取消选中和环和勾去掉他们

字体端使用Ajax做部分回发来更新gridview的。选择所有复选框和GridView复选框，将触发回发。

<asp:UpdatePanel runat="server"> 
    <ContentTemplate> 
     <asp:GridView ID="gvCheckBoxes" runat="server"> 
      <Columns> 
       <asp:TemplateField > 
        <ItemTemplate> 
         <asp:CheckBox ID="cbCheckBox" OnCheckedChanged="CheckBoxChanged" AutoPostBack="true" runat="server" /> 
        </ItemTemplate> 
        /asp:TemplateField> 
      </Columns> 
     </asp:GridView> 
    </ContentTemplate> 
    <Triggers> 
     <asp:AsyncPostBackTrigger ControlID="cbSelectAll"/> 
    </Triggers> 
</asp:UpdatePanel>

背后

全选复选框事件处理程序遍历GridView和发现的复选框代码。如果全选复选框被选中，它会将它们打勾，否则它会剔除它们

gridview复选框事件处理程序遍历复选框并设置一个标志以确定是否应勾选或取消选中全选复选框。它存在的循环，如果任何一个复选框被选中不作为选择所有因此必须取消选中以及

public void SelectAll (Object sender, Eventargs e) 
{ 
    foreach (var row in grid.Rows) 
    { 
     var checkBox = (CheckBox)row.FindControl("cbCheckBox"); 
     checkBox.Checked = cbSelectAll.Checked;   
    } 
} 

public void CheckBoxChanged(Object sender, Eventargs e) 
{ 
    var isSelectAll = true; 

    foreach (var row in grid.Rows) 
    { 
     var checkBox = (CheckBox)row.FindControl("cbCheckBox"); 

     if(!checkBox.Checked) 
     { 
      isSelectAll = false; 
      break; 
     } 
    } 

    cbSelectAll.Checked = isSelectAll;   
}

来源

2013-06-25 16:20:28 skyfoot

0

我能想到的最好的办法是转换GridView的CheckBoxField到TemplateField。再用线在你TemplateField新asp:CheckBox到CheckedChanged事件。在您的代码隐藏，你处理的CheckedChanged事件，那么当任何复选框更改为选中，您可以切换你的“检查所有”复选框。

来源

2013-06-25 16:22:10

2

function SelectheaderCheckboxes(headerchk) { 
debugger 
var gvcheck = document.getElementById('gvdetails'); 
var i; 
//Condition to check header checkbox selected or not if that is true checked all checkboxes 
if (headerchk.checked) { 
for (i = 0; i < gvcheck.rows.length; i++) { 
var inputs = gvcheck.rows[i].getElementsByTagName('input'); 
inputs[0].checked = true; 
} 
} 
//if condition fails uncheck all checkboxes in gridview 
else { 
for (i = 0; i < gvcheck.rows.length; i++) { 
var inputs = gvcheck.rows[i].getElementsByTagName('input'); 
inputs[0].checked = false; 
} 
} 
} 

<asp:GridView ID="gvdetails" runat="server" DataSourceID="dsdetails" onrowdatabound="gvdetails_RowDataBound" > 
<Columns> 
<asp:TemplateField> 
<HeaderTemplate> 
<asp:CheckBox ID="chkheader" runat="server" onclick="javascript:SelectheaderCheckboxes(this)" /> 
</HeaderTemplate> 
<ItemTemplate> 
<asp:CheckBox ID="chkchild" runat="server"/> 
</ItemTemplate> 
</asp:TemplateField> 
</Columns> 
</asp:GridView>

来源

2013-06-25 16:22:40

0

看看这段代码。希望这会帮助你

<div> 
<asp:CheckBox ID="chkSelectAll" runat="server" /> 
    <asp:GridView ID="GridView1" runat="server"> 
     <Columns> 
      <asp:TemplateField HeaderText="Select"> 
       <ItemTemplate> 
        <asp:CheckBox ID="chkSelect" runat="server" oncheckedchanged="chkSelect_CheckedChanged" AutoPostBack="true" /> 
       </ItemTemplate> 
      </asp:TemplateField> 
     </Columns> 
    </asp:GridView> 
</div> 

protected void chkSelect_CheckedChanged(object sender, EventArgs e) 
    { 
     bool isFound = false; 
      foreach (GridViewRow gvr in GridView1.Rows) 
      { 
       CheckBox chkSelect = gvr.FindControl("chkSelect") as CheckBox; 
       if (chkSelect.Checked == false) 
       { 
        isFound = true; 
        break; 
       } 

      } 

      if (isFound) 
      { 
       chkSelectAll.Checked = false; 
      } 
      else 
      { 
       chkSelectAll.Checked = true; 

      } 
    }

来源

2013-06-25 16:37:46

+1

也许你能解释一下你做了，为什么呢？另外，当用两种不同的语言发布代码时，我建议在它们之间包括一段文字（如果没有其他的话）指出这个开关。这也为您提供了机会（如果有必要）给语法高亮器切换规则提示。 –

0

下面的代码应该工作。我测试了它。

的Javascript：

<script type="text/javascript"> 
     function OnOneCheckboxSelected(chkB) { 
      var IsChecked = chkB.checked; 
      var Parent = document.getElementById('gridFileList'); 
      var cbxAll; 
      var items = Parent.getElementsByTagName('input'); 
      var bAllChecked = true; 
      for (i = 0; i < items.length; i++) { 
       if(items[i].id.indexOf('cbxSelectAll') != -1){ 
        cbxAll = items[i]; 
        continue; 
       } 
       if (items[i].type == "checkbox" && items[i].checked == false) { 
        bAllChecked = false; 
        break; 
       } 
      } 
      cbxAll.checked = bAllChecked; 
     } 

     function SelectAllCheckboxes(spanChk) { 
      var IsChecked = spanChk.checked; 
      var cbxAll = spanChk; 
      var Parent = document.getElementById('gridFileList'); 
      var items = Parent.getElementsByTagName('input'); 
      for (i = 0; i < items.length; i++) { 
       if (items[i].id != cbxAll.id && items[i].type == "checkbox") { 
        items[i].checked = IsChecked; 
       } 
      } 
     } 
    </script>

ASPX标记：

<asp:TemplateField HeaderText="Select"> 
    <HeaderTemplate> 
     <asp:CheckBox ID="cbxSelectAll" OnClick="javascript:SelectAllCheckboxes(this);" runat="server" /> 
    </HeaderTemplate> 
    <ItemTemplate> 
     <asp:CheckBox OnClick="javascript:OnOneCheckboxSelected(this);" ID="cbxSelect" runat="server" /> 
    </ItemTemplate> 
</asp:TemplateField>

来源

2013-09-22 06:30:35 RickeyShao

-1

上面的代码我modifiyed它，如果用户选中网格的子行。网格标题将自动取消选中。

<script type="text/javascript"> 
    function UncheckHeader(headerchk) { 
     var gvcheck = document.getElementById('gvdetails'); 
      var inputs = gvcheck.rows[0].getElementsByTagName('input'); 
      inputs[0].checked = false; 
    } 
    function SelectAll(headerchk) { 
     var gvcheck = document.getElementById('gvdetails'); 
     var i; 
     // if true checked all checkboxes 
     if (headerchk.checked) { 
      for (i = 0; i < gvcheck.rows.length; i++) { 
       var inputs = gvcheck.rows[i].getElementsByTagName('input'); 
       inputs[0].checked = true; 
      } 
     } 
      //if condition fails uncheck all checkboxes in gridview 
     else { 
      for (i = 0; i < gvcheck.rows.length; i++) { 
       var inputs = gvcheck.rows[i].getElementsByTagName('input'); 
       inputs[0].checked = false; 
      } 
     } 
    } 
</script> 
<asp:GridView ID="gvdetails" runat="server" > 
     <Columns> 
      <asp:TemplateField> 
       <HeaderTemplate> 
        <asp:CheckBox ID="chkheader" runat="server" onclick="javascript:SelectAll(this)" /> 
       </HeaderTemplate> 
       <ItemTemplate> 
        <asp:CheckBox ID="chkchild" runat="server" onclick="javascript:UncheckHeader(this)" /> 
       </ItemTemplate> 
      </asp:TemplateField> 
     </Columns> 
    </asp:GridView>

详情here

来源

2016-06-01 15:53:49

如何取消选中全部选中复选框，当一个复选框未选中

回答

相关问题