c# - 如何将行附加到gridview而不是完全刷新

Question

我有一个下拉列表。在更改下拉列表的索引时，我在 asp.net gridview 中填充了一行。

每当下拉列表值发生变化时，我不想刷新整个网格视图，而是将新行附加到网格视图中。

有谁知道怎么做？我的代码如下：

aspx：

<table>
        <tr>
            <td>
                <div>
                    <asp:Label ID="lblClient" runat="server" Text="Client :" CssClass="label" ForeColor="Black"></asp:Label>
                    <asp:DropDownList ID="ddlClient" runat="server" AppendDataBoundItems="true" AutoPostBack="true" OnSelectedIndexChanged="ddlClient_SelectedIndexChanged">
                        <asp:ListItem Text="ALL" Value="0"></asp:ListItem>
                    </asp:DropDownList>
                </div>
            </td>
        </tr>
        <tr>
        <td>
        <asp:GridView ID="gvMainLog" runat="server" Visible="true" AllowSorting="True" AutoGenerateColumns="False"AllowPaging="true">
                    <Columns>
                    <asp:TemplateField ShowHeader="False">
                        <ItemTemplate>
                                   <div id='<%# "myRow" + Container.DataItemIndex %>'> 
                                   <asp:Literal ID="ltId" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "Instruction")%>'></asp:Literal>
                                 <img src="../Images/KnobRed.png" onclick='<%# "deleteRow(\"myRow" + Container.DataItemIndex+"\")" %>'/> </div>
                        </ItemTemplate>
                    </asp:TemplateField>
                    </Columns>
                    </asp:GridView>
        </td>
        </tr>
    </table>

aspx.cs

  protected void ddlClient_SelectedIndexChanged(object sender, EventArgs e)
        {
            gvMainLog.DataSource = GetDealerSetupUtilityByClientId(1,1);
            gvMainLog.DataBind();

        }

javascript

<script type="text/javascript">
    function deleteRow(rowId) {
    $("#" + rowId).remove();
}
</script>

Answer 1

在javascript中试试这个

//添加新行

function AddNewRecord()
        {
            var grd = document.getElementById('GridView1');
            var tbod=grd.rows[0].parentNode;
            var newRow=grd.rows[grd.rows.length - 1].cloneNode(true);
            tbod.appendChild(newRow);
            return false;

        }

//删除旧行

function delrow(rowindex)

{

var gridID=document.getElementById("<%=grid.ClientID %>");

gridID.deleteRow(rowindex+1);     

return false;

}

Answer 2

这可能需要注释，但我想显示一行代码

Container.DataItemIndex应该替换为<%#DataBinder.Eval(Container, "DataItemIndex")%>并且函数 deleteRow 需要出来。

您的 onclick 应如下所示

onclick="deleteRow(myRow + <%#DataBinder.Eval(Container, "DataItemIndex")%>"