两个多选择复选框列中的GridView

我有两个复选框两列，所以一旦点击选择它应该只选择对所有chkStatus和同所有headerChkbox去与chkUpdate两个多选择复选框列中的GridView

，但下面的代码是选择并取消选择时都亚姆要选择任何one.but我想让他们相互独立other.means的时候我选择headerChkbox在选择同一特定的列只应选择或取消所有复选框无二其他

<telerik:GridTemplateColumn UniqueName="CheckBoxTemplateColumn"> 
    <HeaderStyle Width="50px" HorizontalAlign="Center" /> 
    <ItemStyle HorizontalAlign="Left" /> 
    <ItemTemplate> 
     <asp:CheckBox ID="chkStatus" runat="server" Width="15px" Checked='<%# Convert.ToBoolean(Eval("isAssignJD")) %>' /> 
    </ItemTemplate> 
    <HeaderTemplate> 
     <asp:CheckBox ID="headerChkbox" runat="server" onclick="javascript:SelectAllCheckboxesSpecific(this);" /> 
    </HeaderTemplate> 
</telerik:GridTemplateColumn> 
<telerik:GridTemplateColumn UniqueName="CheckBoxTemplate"> 
    <HeaderStyle Width="50px" HorizontalAlign="Center" /> 
    <ItemStyle HorizontalAlign="Left" /> 
    <ItemTemplate> 
     <asp:CheckBox ID="chkUpdate" runat="server" Width="15px" Checked="false" /> 
    </ItemTemplate> 
    <HeaderTemplate> 
     <asp:CheckBox ID="headerUpdate" runat="server" onclick="javascript:SelectAllCheckboxesSpecific(this);" /> 
    </HeaderTemplate> 
</telerik:GridTemplateColumn>

这里是我的功能

function SelectAllCheckboxesSpecific(spanChk) { 
    // Select checkboxes that place in grid 
    var IsChecked = spanChk.checked; 
    var Chk = spanChk; 
    Parent = document.getElementById('ctl00_ContentPlaceHolder1_gvJobPosition'); 
    var items = Parent.getElementsByTagName('input'); 
    for (i = 0; i < items.length; i++) { 
     if (items[i].id != Chk && items[i].type == "checkbox") { 
      if (items[i].checked != IsChecked) { 
       items[i].click(); 
      } 
     } 
    } 
}

这里是我的HTML渲染代码

<tr class="rgRow" id="ctl00_ContentPlaceHolder1_gvJobPosition_ctl00__0"> 
    <td style="display:none;">0561fb4f-e410-4d83-a0e5-6d6d68fe3dba</td><td align="left"> 
            <span class="category1" style="display:inline-block;width:15px;"><input id="ctl00_ContentPlaceHolder1_gvJobPosition_ctl00_ctl04_chkStatus" type="checkbox" name="ctl00$ContentPlaceHolder1$gvJobPosition$ctl00$ctl04$chkStatus" checked="checked" /></span> 
           </td><td align="left"> 
            <span class="category2" style="display:inline-block;width:15px;"><input id="ctl00_ContentPlaceHolder1_gvJobPosition_ctl00_ctl04_chkStatuss" type="checkbox" name="ctl00$ContentPlaceHolder1$gvJobPosition$ctl00$ctl04$chkStatuss" /></span> 
           </td>

来源

2014-01-25 Ameer Ali Shar

我更新了一个工作示例的代码，只是不要忘记包含jQuery js文件。 – 2014-01-25 05:20:07

这条线是你的问题：

var items = Parent.getElementsByTagName('input');

您选择页面上的所有复选框。为什么不使用jQuery？这是很容易：

给所有复选框第1类的class =“类别1”，给类=“类别2”在类别中的所有复选框2.

然后给类=“setAll1”和class =” setAll2“作为标题复选框。然后写：

$(document).ready(function(){ 
    $('.setAll1').click(function(){ 
     if($('.setAll1').is(':checked')) 
      $('.category1').prop('checked',true); 
     else 
      $('.category1').prop('checked',false); 
    }); 
    $('.setAll2').click(function(){ 
     if($('.setAll2').is(':checked')) 
      $('.category2').prop('checked',true); 
     else 
      $('.category2').prop('checked',false); 
    }); 
});

而对于HTML：

<body> 
    <input type=checkbox class="setAll1"/> 
    <input type=checkbox class="category1"/><input type=checkbox class="category1"/><input type=checkbox class="category1"/> 
    <br/><br/><br/> 
    <input type=checkbox class="setAll2"/> 
    <input type=checkbox class="category2"/><input type=checkbox class="category2"/><input type=checkbox class="category2"/> 
</body>

有很多方法在jQuery来做到这一点，但这种方式是，来到我的头第一。

来源

2014-01-25 04:44:27

你能告诉我一些示例代码iam新增Jquery，Javascript –

更新了一些代码。 – 2014-01-25 05:02:32

@Ilya Nemtsev-你测试了你的代码吗？ – afzalulh

两个多选择复选框列中的GridView

回答

相关问题