根据复选框字段在gridview中对行进行操作

Question

我有一个GridView，其中第一个字段是复选框。我想根据复选框的状态采取行动客户端（显示或隐藏行）。

感谢my previous StOf posting，我有一个RadioButtonList正确地发射我的Javascript。现在需要获取对相应行的引用。

我一直依靠几个问题和答案，建立我当前的Javascript：

$(function() { 
    $("#RadioButtonList1 input[id^=Radio]").click(function() { 
     var grd = $("#my_gridview"); 
     var rows = $("#my_gridview tr:gt(0)"); 

     switch (this.value) { 
      case "All": 
       { 
        $("#my_gridview tr").show(); 
       } 

      case "HideRequested": 
       { 
        var rowToShow = rows.find("td:eq(0)").filter(checked != "checked"); 
        rows.show().not(rowToShow).hide(); 
       } 

      case "ShowRequested": 
       { 
        var rowToShow = rows.find("td:eq(0)").filter(checked == "checked"); 
        rows.show().not(rowToShow).hide(); 
       } 

     } 
    }) 
}); 

但是当我运行这一点，我在JS控制台得到一个错误：的ReferenceError：检查没有定义。这很奇怪，因为它适用于其他问题，并且生成的HTML（在控制台中确认）包含input元素中的checked属性。的HTML是：

<table cellspacing="0" cellpadding="2" id="gv_grid" style="border-color:Black;border-width:1px;border-style:None;width:100%;border-collapse:collapse;"> 
    <tr class="grGridViewHeader" style="white-space:nowrap;"> 
     <th align="center" scope="col" style="width:100px;white-space:nowrap;">Select Entry</th><th scope="col">Entry Name</th><th align="left" scope="col">Type</th><th align="left" scope="col">Details</th> 
    </tr><tr valign="top" style="background-color:#BED3FC;border-style:None;"> 
     <td align="center" valign="middle" style="white-space:nowrap;"> 
         <input id="gv_grid_chk_selected_0" type="checkbox" name="gv_grid$ctl02$chk_selected" checked="checked" /> 
        </td><td>Entry 1</td><td style="font-size:Small;">Foo</td><td style="font-size:Small;">Assorted text.</td> 
    </tr><tr valign="top" style="background-color:White;border-style:None;"> 
     <td align="center" valign="middle" style="white-space:nowrap;"> 
         <input id="gv_grid_chk_selected_1" type="checkbox" name="gv_grid$ctl03$chk_selected" checked="checked" /> 
        </td><td>Entry 2</td><td style="font-size:Small;">Bar</td><td style="font-size:Small;">Assorted text.</td> 
    </tr><tr valign="top" style="background-color:#BED3FC;border-style:None;"> 
     <td align="center" valign="middle" style="white-space:nowrap;"> 
         <input id="gv_grid_chk_selected_2" type="checkbox" name="gv_grid$ctl04$chk_selected" checked="checked" /> 
        </td><td>Entry 3</td><td style="font-size:Small;">Baz</td><td style="font-size:Small;">Assorted text.<br /></td> 
    </tr> 
</table> 

我也曾尝试：

var checkboxArray = $('#my_gridview td input:checkbox'); 

其中确实产生复选框元素的数组，但我仍然不知道如何正确地过滤了checked财产，也不如何回到治理tr元素。

来源：

https://stackoverflow.com/a/6013026/2615836

https://stackoverflow.com/a/6068768/2615836

Answer 1

在这里你去... http://jsfiddle.net/tdyhq8z7/2/

$(function() { 
    $("#RadioButtonList1 :radio").click(function() { 
     var $rows = $("#gv_grid tr:gt(0)").show(); 
     switch (this.value) { 
      case "HideRequested": 
       $rows.filter(function(){ 
        return $('td:first>:checkbox',this).is(":checked") 
       }).hide(); 
       break; 
      case "ShowRequested": 
       $rows.filter(function(){ 
        return !$('td:first>:checkbox',this).is(":checked") 
       }).hide(); 
       break; 
     } 
    }) 
}); 

//another solution: 
$(function() { 
    $("#RadioButtonList1 :radio").click(function() { 
     var $rows = $("#gv_grid tr:gt(0)").show(), $val=this.value; 
     if(this.value != "All"){ 
      $rows.filter(function(){ 
       var $checked = $('td:first>:checkbox',this).is(":checked"); 
       if($val == "HideRequested") return $checked; 
       else if($val == "ShowRequested") return !$checked; 
      }).hide(); 
     } 
    }) 
});