Question

我在第一列中有GridView CheckBox，在SecondLast列上有Button。当用户点击Button时，CheckBox的{{1}}必须current row使用Invisible。

Javascript

使用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>

一切正常，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; }我就空了。无法获取alert控件的ID

还试过：

CheckBox

呈现CheckBox：

<script type="text/javascript">
    $(document).ready(function() {
    $(function() {
        $(".showButton").on("click", function() {
            alert(".showButton clicked");
            $(this).closest("tr").find(":checkbox").hide();
        });
    });
    });
</script>

网格中的呈现按钮：

<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>

任何想法？

帮助感谢！

Answer 1

这是我的完整解决方案：

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;
}

感谢所有..！：）

Answer 2

首先没有回发，将asp按钮更改为，输入type =按钮或html按钮：

<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>
                <input type="button" class="showButton" value="Source"/>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

然后使用这样的脚本来隐藏复选框。您不需要复选框的id，只需找到父行并隐藏复选框：

$(function() {
    $(".showButton").on("click", function() {
          $(this).closest("tr").find(":checkbox").hide();
    });
});

Answer 3

尝试使用以下内容：

var result = $('#<%=GridView1.ClientID %> tr td input[id*="chkSelect"][type=checkbox]:checked').map(function () {

    return $(this).closest('tr').find('td').eq(2).text();

    }).get().join();

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

3 个答案: