使用jQuery選擇GridView ASP.NET中的所有複選框

我在我的Gridview模板列中名爲「類別A」和「類別B」的複選框。我希望選擇全部功能，即當用戶選中A類列中的全選複選框時，必須在該列下檢查所有複選框。同樣的B類。我正在嘗試下面的代碼。我的代碼的問題是，它會選中整個gridview中的所有複選框，「類別A」以及「類別B」的複選框。但是，我只想在同一列下選中複選框。使用jQuery選擇GridView ASP.NET中的所有複選框

function SelectAllCheckboxesA(chk) { 
       $('#<%=gvSurveys.ClientID %>').find("input:checkbox").each(function() { 
        if (this != chk) { 
         if ($(this).hasClass('CatA') != false) { 
          this.checked = chk.checked; 
         } 
        } 
        else { 
         alert($(this)); 
        } 
       }); 
      } 




<asp:GridView ID="gvSurveys" runat="server" AutoGenerateColumns="false" AllowSorting="True" Width="1500px"> 
          <Columns> 
           <asp:TemplateField> 
           <HeaderTemplate>Category A 
    <asp:CheckBox ID="chkSelectAllCatA" runat="server" Visible="false" onclick="javascript:SelectAllCheckboxesA(this);" CssClass="SACatA" /> 
    </HeaderTemplate> 
    <ItemTemplate> 
    <asp:CheckBox ID="chkCatA" runat="server" Enabled="false" CssClass="CatA" /> 
    </ItemTemplate> 
    </asp:TemplateField> 
    <asp:TemplateField> 
    <HeaderTemplate> 
    Category B 
    <asp:CheckBox ID="chkSelectAllCatB" runat="server" Visible="false" CssClass="CatB" onclick="javascript:SelectAllCheckboxesB(this);" /> 
    </HeaderTemplate> 
    <ItemTemplate> 
    <asp:CheckBox ID="chkCatB" runat="server" Enabled="false" /> 
    </ItemTemplate> 
    </asp:TemplateField> 
    </Columns> 
    </asp:GridView>

來源

2010-05-18 dexter

爲了愛幼犬正確地格式化您的代碼（並接受一些答案）。 – R0MANARMY 2010-05-18 13:38:18

@ROMAN - 只有4個符合條件的問題和16個代表點。你可能想讓他有點鬆懈，並指出系統的工作原理。 – tvanfosson 2010-05-18 13:44:39

@tvanfosson：註冊用戶3個月。常見問題解答是有原因的。 – R0MANARMY 2010-05-19 03:07:42

你爲什麼不選擇只CategoryA的複選框：

$('#<%=gvSurveys.ClientID %>').find("input:checkbox[Id*=chkCatA]")

將這項工作？

來源

2010-05-18 13:37:45 PeterFromCologne

由於他將「CatA」類添加到複選框，類選擇器也可以工作（並且看起來更簡單）。 – R0MANARMY 2010-05-18 13:40:37

沒有這沒有幫助。我試圖特別提到「輸入：複選框[Id * = chkCatA]」。 – dexter 2010-05-18 14:05:54

將selectAll複選框更改爲具有相同的類。然後從複選框中提取該類並將其用作選擇器的一部分，從而篩選出該選擇。這將簡化很多事情，因爲您知道所有匹配的輸入都只需從參數中獲取選中的值。

function SelectAllCheckboxesA(chk) { 
    var $chk = $(chk); 
    var myClass = $chk.attr('class'); 
    $('#<%=gvSurveys.ClientID %>') 
     .find("input." + myClass + ":checkbox") 
     .not($chk) 
     .attr('checked', $chk.attr('checked')); 
}

來源

2010-05-18 13:43:11 tvanfosson

嗨，謝謝你的回覆。這也有同樣的效果，所有的複選框都在整個Gridview中被選中。 – dexter 2010-05-18 14:07:05

@dexter - 那麼你的代碼有問題。如果標題中的複選框具有不同的類（相互之間），並且這些類與列中的複選框匹配，這應該起作用。選擇器是特定於類的，並且不會選擇任何沒有該類的複選框。 – tvanfosson 2010-05-18 15:18:59

$('#<%=gvSurveys.ClientID %>').find('input[Id*="chkCatA"]:checkbox').each(function() { 
      if (this != chk) { 
       this.checked = chk.checked; 
      } 
     });

來源

2011-01-14 16:36:11 Aravind

這是基於具有一些修改提出Ashish Patil以清除複選框的標題行中，當任何在網格行的複選框的未選中的解決方案。

在GridView控件創建一個模板列：

<asp:templatefield> 
<headertemplate> 
    <asp:CheckBox ID="chkSelectAll" cssclass="chkHeader" runat="server" /> 
</headertemplate> 
<itemtemplate> 
    <asp:CheckBox ID="chkSelect" cssclass="chkItem" runat="server"/> 
</itemtemplate> 
</asp:templatefield>

jQuery腳本，把它放在$（文件）。就緒例如：

var headerChk = $(".chkHeader input"); 
var itemChk = $(".chkItem input"); 

headerChk.click(function() { 
itemChk.each(function() { 
    this.checked = headerChk[0].checked; }) 
}); 

itemChk.each(function() { 
    $(this).click(function() { 
    if (this.checked == false) { headerChk[0].checked = false; } 
    }) 
});

來源

2012-01-21 18:35:19 Califf

amazing..this完美的爲我..謝謝 – 2012-08-29 23:49:44

頭中具有一個複選框創建該行：

<asp:TemplateField HeaderText="Merged Client"> 
       <HeaderTemplate> 
        <asp:CheckBox ID="chkboxSelectAll" runat="server" AutoPostBack="true" OnCheckedChanged="chkboxSelectAll_CheckedChanged" ></asp:CheckBox> Merged Client 
       </HeaderTemplate> 
       <ItemTemplate> 
        <asp:CheckBox ID="CheckMergedClient" **runat="server"** **onclick="CheckChanged()" OnCheckedChanged="CheckMergedClient_CheckedChanged"** **AutoPostBack="true"** value='<%# Eval("ClientId") %>'/>         </ItemTemplate> 
</asp:TemplateField>

在代碼後面加OnCheckChanged事件處理程序來選擇或取消選擇所有：

protected void chkboxSelectAll_CheckedChanged(object sender, EventArgs e) 
    { 
     CheckBox ChkBoxHeader = (CheckBox)ClientMatchGridView.HeaderRow.FindControl("chkboxSelectAll"); 
     foreach (GridViewRow row in ClientMatchGridView.Rows) 
     { 
      CheckBox ChkBoxRows = (CheckBox)row.FindControl("CheckMergedClient"); 
      if (ChkBoxHeader.Checked == true) 
      { 
       ChkBoxRows.Checked = true; 
      } 
      else 
      { 
       ChkBoxRows.Checked = false; 
      } 
     } 
    }

來源

2014-10-29 21:13:41

使用jQuery選擇GridView ASP.NET中的所有複選框

回答

相關問題