jquery gridview复选框操作函数

我的gridview（gvAvailable）中的第一列是当前复选框列“chkSelect”。现在它的工作方式是用户可以检查gridview上的多个复选框，但我想要一个jquery函数来取消选中gridview中除点击复选框之外的所有复选框。jquery gridview复选框操作函数

我也在寻找一种方式来访问与点击按钮上的jquery的选中行的列。

感谢所有帮助

下面是生成的HTML的外观

<table class="Grid" cellspacing="0" border="0" id="gvAvailable" style="width:99%;border-collapse:collapse;"> 
<tr class="GridHeader"> 
<th scope="col">&nbsp;</th><th scope="col">Guid</th><th scope="col">Id</th><th scope="col">Name</th> 
    <th scope="col">Facility</th><th scope="col">Room</th> 
</tr> 
<tr class="GridItem"> 
    <td> 
     <input id="gvAvailable_ctl02_chkSelect" type="checkbox" name="gvAvailable$ctl02$chkSelect" /> 
    </td> 
    <td>24</td> 
    <td>000101020201</td> 
    <td>Test</td> 
    <td>Test Facility</td> 
    <td>&nbsp;</td> 
</tr><tr class="GridAltItem"> 
<td> 
    <input id="gvAvailable_ctl03_chkSelect" type="checkbox" name="gvAvailable$ctl03$chkSelect" /> 
</td> 
<td>25</td> 
<td>1001</td> 
<td>Test 2</td> 
<td>Test 3</td> 
<td>&nbsp;</td> 
</tr> 
</table>

来源

2009-04-22 AlteredConcept

你可以张贴一些生成的HTML？我知道jQuery，但我不是一个.NET人，所以我不知道gridview是什么或它可能显示什么。 – 2009-04-22 04:13:02

如果您将相同的类添加到标记中的每个复选框，您可以通过说

$('.classname')

这会让你回到对象数组。然后你可以调用数组中的'each'并全部取消选中它们。

function removeChecks() 
{  
    $('.classname').each(function() 
    { 
     $(this).removeAttr('checked'); 
    }); 
}

然后单击处理程序中增加上述函数调用的每个复选框：

$('.classname').each(function() 
{ 
    $(this).click(function() 
    { 
     removeChecks(); 
     $(this).attr('checked', 'checked'); 
    }); 
});

上面的代码应设置在网页加载运行。

来源

2009-04-22 04:28:42

谢谢彩弹球。你知道我可以用来访问按钮点击事件上的检查行列的方法吗？ – AlteredConcept 2009-04-22 06:46:32

在jquery中，您可以很容易地访问父元素，以及DOM树中的元素的兄弟。要访问同一中所有元素的数组，您可以选中复选框的父级的兄弟。代码： $（'checkbox'）。parent（）。siblings（）将返回与复选框相同行中的元素的数组。从那里你可以做任何你想要的元素。 – 2009-04-22 14:38:55

我发现在ASP.NET复选框列表this articale非常有用的选择/取消所有项目使用jQuery

来源

2009-04-22 04:21:38 Adeel

我假设你想确保用户点击复选框不会被切换？如果是这样，继续下面。

首先，给gridview中的所有复选框添加一个类名。

每当点击一个复选框时，向它添加另一个类来表示它是物理选择的。

$('.checkbox').click(function(){ 
    $(this).addClass('checked'); 
});

现在，当用户点击选择所有复选框（姑且称之为“全选”）之上，通过所有的复选框迭代，并切换状态，同时检查“检查”类

$('#selectAll').click(function(){ 
    var status = $(this).attr('checked') 
    $('.checkbox').each(function(){ 
     //only toggle if not set 
     if(!$(this).hasClass('checked')){ 
     if(status){ 
      $(this).attr('checked', 'checked'); 
     } 
     else{ 
      $(this).attr('checked', ''); 
     } 
     } 
    }); 
});

这应该让你沿着你的快乐方式希望。

现在，访问检查行的列？

You could add an onclick event to each table row. 
$('#tablename tr').click(function(){ 
    //do something 
});

来源

2009-04-22 04:42:37 Dhana

在这个例子中，我把一个按钮，检查，和一个键取消GridView的复选框：

<asp:GridView runat="server" ID="grid"></asp:GridView> 

<input type="button" onclick="uncheckCheckBoxes()" value="UnCheck" /> 
&nbsp; 
<input type="button" onclick="checkCheckBoxes()" value="Check" /> 

<script> 
    function uncheckCheckBoxes() 
    { 
     var gridClientID = '<%= grid.ClientID %>'; 
     jQuery.each($("#" + gridClientID + " input[type='checkbox']"), function() 
     { 
      this.checked = false; 
     }); 
    } 

    function checkCheckBoxes() 
    { 
     var gridClientID = '<%= grid.ClientID %>'; 
     jQuery.each($("#" + gridClientID + " input[type='checkbox']"), function() 
     { 
      this.checked = true; 
     }); 
    } 
</script>

来源

2009-04-22 07:00:58 Canavar

jquery gridview复选框操作函数

回答

相关问题