Question

我有一个ASP.Net gridview，我想数据绑定到。我想要做的是当单击行上的按钮/选择行时更改行的颜色。我想用前端的knockoutjs来完成这个。做一些非常像 this 的事情。我还没有找到任何可以澄清我如何将数据绑定到一行并使所选行更改的内容。

 <asp:GridView ID="grvAccounts" runat="server" CellPadding="4" ForeColor="#333333" GridLines="Both" AutoGenerateColumns="false" Width="100%" OnRowCommand="grvAccounts_RowCommand1" DataKeyNames="UDField1">
            <AlternatingRowStyle/>
            <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" 
     />
            <RowStyle BackColor="#EDF3FC" /> 
            <Columns>
                <asp:BoundField ItemStyle-CssClass="Hide" HeaderStyle-CssClass="Hide" />
                <asp:TemplateField HeaderStyle-Width="80px" HeaderText="Process">
                    <ItemTemplate>
                        <asp:Button ID="btnProcess" Text="Process" runat="server" CommandName="Process" CommandArgument="<%# Container.DataItemIndex %>" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:BoundField DataField="UDField1" ItemStyle-CssClass="Hide" HeaderStyle-CssClass="Hide" />
                <asp:BoundField DataField="UserID" ItemStyle-CssClass="Hide" HeaderStyle-CssClass="Hide" />

 />

                <asp:BoundField DataField="AccountID" ItemStyle-CssClass="Hide" HeaderStyle-CssClass="Hide" />
                <asp:BoundField DataField="FirstName" ItemStyle-CssClass="Hide" HeaderStyle-CssClass="Hide" />
                <asp:BoundField DataField="LastName" ItemStyle-CssClass="Hide" HeaderStyle-CssClass="Hide" />
                <asp:BoundField DataField="MasterID" ItemStyle-CssClass="Hide" HeaderStyle-CssClass="Hide" />
                <asp:BoundField DataField="Phone" ItemStyle-CssClass="Hide" HeaderStyle-CssClass="Hide" />
                            <asp:TemplateField HeaderStyle-Width="80px" HeaderText="Download">
                    <ItemTemplate>
                        <asp:Button ID="btnDownload" Text="Download" runat="server" CommandName="Download" CommandArgument="<%# Container.DataItemIndex %>" />
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>

Answer 1

$(function () {
    $("[id*=GridView1] td").bind("click", function () {
        var row = $(this).parent();
        $("[id*=GridView1] tr").each(function () {
            if ($(this)[0] != row[0]) {
                $("td", this).removeClass("selected_row");
            }
        });
        $("td", row).each(function () {
            if (!$(this).hasClass("selected_row")) {
                $(this).addClass("selected_row");
            } else {
                $(this).removeClass("selected_row");
            }
        });
    });
});

knockout数据绑定到ASP gridview

1 个答案: