如何隐藏使用Javascript从GridView选定的行的复选框？

本文介绍了如何隐藏使用Javascript从GridView选定的行的复选框？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！问题描述 29岁程序员，3月因学历无情被辞！在第一列和 < ASP：GridView的ID = GridView1 RUNAT = 服务器的AutoGenerateColumns = 假 AllowPaging = 真每页= 100 AllowSorting = 真的DataSourceID = sqlUsers 的DataKeyNames = ttppcid 宽度= 100％ OnRowCommand = GridView1_RowCommand EmptyDataText = 否找到数据 OnPageIndexChanging = GridView1_PageIndexChanging OnRowDataBound = GridView1_RowDataBound > <列> < asp：TemplateField ItemStyle-Width =30pxItemStyle-HorizontalAlign =CenterHeaderStyle-HorizontalAlign =CenterVisible =true> < ItemTemplate> < asp：CheckBox ID =chkSelectrunat =serverHeight =30class =mychkrowid =<％＃Container.DataItemIndex + 1％> /> < / ItemTemplate> < / asp：TemplateField> //这里有更多模板< asp：TemplateField HeaderText =ItemStyle-Width =70pxItemStyle-HorizontalAlign =Center HeaderStyle-HorizontalAlign =Center> < ItemTemplate> < asp：Button ID =BtnSourcerunat =serverText =Sourcerowid =<％＃Container.DataItemIndex + 1％> class =showButtonOnClick ='<％＃return SetRowValues（+ Eval（ttppcid）+，this.id，+ Eval（Fair）+，+ Eval 好）+，+ Eval（Mint）+，+ Eval（Poor）+，+ Eval（Fair）+）％>'/> < / ItemTemplate> < / asp：TemplateField> < /列> < / asp：GridView> Javascript：函数SetRowValues（id，controlid，fair，good，mint，nnew，poor，broken）{ var rowid = $（＃+ controlid）.attr（ ROWID）; var chkBoxID; var chkRowid; $（'。mychk'）。css（display，block）; $ b $（'。mychk'）。each（function（）{ chkBoxID = this.id; alert（chkBoxID）; chkRowid = $（＃+ chkBoxID）.attr（rowid）; alert（chkBoxID +ROW：+ chkRowid）; if（chkRowid == rowid）{ $（＃+ chkBoxID）.css（display，none）; } else { $（＃+ chkBoxID） .css（display，block）; } }）; 返回false; 所有的工作都在 alert 我变空了。无法获得 CheckBox的ID 控制同时试过： < script type =text / javascript> $（document）.ready（function（）{ $（function（）{ $（。showButton）。on（click，function（）{$ b $ （。showButton clicked）; $（this）.closest（tr）。find（：checkbox）。hide（）; }）; } ）; }）; < / script> 呈现CheckBox： < td align =centerstyle =width：30px; display：block;> 将跨度类= mychk ROWID = 1 风格= 显示：块;高度：30像素; ><输入的ID = ctl00_ContentPlaceHolder1_GridView1_ctl02_chkSelect 类型= 复选框名称=ctl00 $ ContentPlaceHolder1 $ $ GridView1 $ ctl02 chkSelect>< /跨度> < / td> 网格中的呈现按钮： < td align =centerstyle =width：70px; display：block;> 将输入类型= 提交名称= ctl00 $ $ ContentPlaceHolder1 $ GridView1 $ ctl03 BtnSource 值= 源的onclick =返回SetRowValues（6，this.id，222.0000,222.0000,222.0000,222.0000， 222.0000）; WebForm_DoPostBackWithOptions（新WebForm_PostBackOptions（安培; QUOT; ctl00 $ ContentPlaceHolder1 $ GridView1 $ ctl03 $ BtnSource&安培; QUOT;，&安培; QUOT;&安培; QUOT ;,真，&安培; QUOT;&安培; QUOT;，&安培; QUOT;&安培;，false，false））id =ctl00_ContentPlaceHolder1_GridView1_ctl03_BtnSourceclass =showButtonrowid =1style => < / td> 任何想法？帮助赞赏！解决方案以下是我的完整解决方案： var rowid = $（＃+ controlid）.attr（rowid）; var chkBoxID; var chkRowid; $（'span.mychk'）。each（function（）{ chkBoxID = $（this）.attr（'id'）; chkRowid = $（this）.attr（ 'rowid'）; if（chkRowid == rowid）{ $（this）.hide（）; $（this）.closest（td）。css（border ，none）; } else { $（this）.show（）; $（this）.closest（td）。css（边框，1px纯灰）; } }）; 返回false; } 感谢所有..！：） I have a GridView with CheckBox in first column and Button on SecondLast column. When user Clicks on Button the CheckBox of current row must be Invisible using Javascript.<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" AllowPaging="true" PageSize="100" AllowSorting="true" DataSourceID="sqlUsers" DataKeyNames="ttppcid" Width="100%" OnRowCommand="GridView1_RowCommand" EmptyDataText="No Data Found" OnPageIndexChanging="GridView1_PageIndexChanging" OnRowDataBound="GridView1_RowDataBound"> <Columns> <asp:TemplateField ItemStyle-Width="30px" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center" Visible="true"> <ItemTemplate> <asp:CheckBox ID="chkSelect" runat="server" Height="30" class="mychk" rowid="<%# Container.DataItemIndex+1 %>" /> </ItemTemplate> </asp:TemplateField>//some more templates here <asp:TemplateField HeaderText="" ItemStyle-Width="70px" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center"> <ItemTemplate> <asp:Button ID="BtnSource" runat="server" Text="Source" rowid="<%# Container.DataItemIndex+1 %>" class="showButton" OnClick='<%# "return SetRowValues("+Eval("ttppcid")+",this.id,"+Eval("Fair")+","+Eval("Good")+","+Eval("Mint")+","+Eval("Poor")+","+Eval("Fair")+")"%>' /> </ItemTemplate> </asp:TemplateField> </Columns></asp:GridView>Javascript:function SetRowValues(id, controlid, fair, good, mint, nnew, poor, broken) { var rowid = $("#" + controlid).attr("rowid"); var chkBoxID; var chkRowid; $('.mychk').css("display", "block"); $('.mychk').each(function() { chkBoxID = this.id; alert(chkBoxID); chkRowid = $("#" + chkBoxID).attr("rowid"); alert(chkBoxID + " ROW :" + chkRowid); if (chkRowid == rowid) { $("#" + chkBoxID).css("display", "none"); } else { $("#" + chkBoxID).css("display", "block"); } });return false;}All works fine just here in alert i get empty. NOT able to get the ID of the CheckBox ControlAlso Tried With:<script type="text/javascript"> $(document).ready(function() { $(function() { $(".showButton").on("click", function() { alert(".showButton clicked"); $(this).closest("tr").find(":checkbox").hide(); }); }); });</script>Rendered CheckBox:<td align="center" style="width: 30px; display: block;"> <span class="mychk" rowid="1" style="display: block; height: 30px;"><input id="ctl00_ContentPlaceHolder1_GridView1_ctl02_chkSelect" type="checkbox" name="ctl00$ContentPlaceHolder1$GridView1$ctl02$chkSelect"></span></td>Rendered Button in Grid:<td align="center" style="width: 70px; display: block;"> <input type="submit" name="ctl00$ContentPlaceHolder1$GridView1$ctl03$BtnSource" value="Source" onclick="return SetRowValues(6,this.id,222.0000,222.0000,222.0000,222.0000,222.0000);WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$ContentPlaceHolder1$GridView1$ctl03$BtnSource", "", true, "", "", false, false))" id="ctl00_ContentPlaceHolder1_GridView1_ctl03_BtnSource" class="showButton" rowid="1" style=""></td>Any Idea?Help Appreciated! 解决方案 Here is my Complete Solution:function SetRowValues(id, controlid, fair, good, mint, nnew, poor, broken) {var rowid = $("#" + controlid).attr("rowid");var chkBoxID;var chkRowid;$('span.mychk').each(function() { chkBoxID = $(this).attr('id'); chkRowid = $(this).attr('rowid'); if (chkRowid == rowid) { $(this).hide(); $(this).closest("td").css("border","none"); } else { $(this).show(); $(this).closest("td").css("border", "1px solid grey"); }});return false;}Thanks to all..! :) 这篇关于如何隐藏使用Javascript从GridView选定的行的复选框？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！上岸，阿里云！