JQuery方式实现行删除

今天做了一个表格的行删除功能。

方案一

aspx页面代码：

前端表格由reapter渲染而来

<asp:Repeater ID="Repeater1" runat="server" DataSourceID="ObjectDataSource1">
            <HeaderTemplate>
                <table>
                    <tr>
                        <td>标题</td>
                        <td>作者</td>
                        <td>日期</td>
                        <td>内容</td>
                        <td>操作</td>
                    </tr>
            </HeaderTemplate>
            <ItemTemplate>
                <tr>
                    <td><%#Eval("title") %></td>
                    <td><%#Eval("author") %></td>
                    <td><%#Eval("date") %></td>
                    <td><%#Eval("[content]") %></td>
                    <td>
                        <span">
                            <a id="<%#Eval("Id") %>" href="#" onclick ='ADeleteClick(this)'>删除</a>
                        </span>
                        <span>
                            <a href="editInfo.aspx?id=<%#Eval("Id") %>">编辑</a>
                        </span>
                    </td>
                </tr>
            </ItemTemplate>
            <FooterTemplate>
                </table>
            </FooterTemplate>
        </asp:Repeater>

JQuery代码：

<script src="Scripts/jquery-1.4.1.js"></script>
    <script type="text/javascript">

        function ADeleteClick(self) {   //获取行id，实现行删除
            var id = self.id;   //获取自身id

            if (id != null || id !== "") {
                $.post("JQuery行删除.ashx", { "id": id,"action":“deleteRow” }, function (data, status) {
                    if (status == "success") {
                        if (data == "ok") {
                            alert("删除成功！");
                            $("#" + id).parents("tr").remove();
                        }
                        else {
                            alert("删除失败！");
                        }
                    }
                    else {
                        alert("数据传输失败");
                    }
                });
            }
        };
    </script>

cs文件代码：

public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            context.Response.Clear();
            object strId = context.Request["id"].ToString();
            object deleteRow = context.Request["action"].ToString();
            if((deleteRow !=null || deleteRow.ToString()!="")&&deleteRow.ToString()=="deleteRow")
            {
                if ((strId != null || strId.ToString() != ""))
                {
                    string constr = "Data Source=.;database=Test;uid=sa;pwd=sasa";
                    string sql = "delete from T_article where Id= " + Convert.ToInt32(strId);
                    SqlConnection conn = new SqlConnection(constr);
                    conn.Open();
                    SqlCommand cmd = new SqlCommand();
                    cmd.Connection = conn;
                    cmd.CommandText = sql;
                    cmd.ExecuteNonQuery();

                    context.Response.Write("ok");  //返回成功->data
                }
            }

方案二：通过注册OnRowDeleteing事件

基于GridView

前端代码

<asp:GridView ID="ClassGridView" runat="server" EnableModelValidation="True" Width="100%" AutoGenerateColumns="False" OnRowDeleting="ClassGridView_RowDeleting"  DataKeyNames="SystemColumnID"  >
        <Columns>
            <asp:BoundField DataField="SystemColumnID" HeaderText="编号" ReadOnly="True" />
            <asp:BoundField DataField="SystemColumnName" HeaderText="类名" />
            <asp:BoundField DataField="ColumnTypeID" HeaderText="级别" />

            <asp:TemplateField HeaderText="删除" ItemStyle-Width="60">
                <ItemTemplate>
                    <asp:LinkButton ID="LinkButton3" runat="server" CommandName="Delete" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>">删除</asp:LinkButton>
                </ItemTemplate>
                <ItemStyle Width="60px"></ItemStyle>
            </asp:TemplateField>

        </Columns>
    </asp:GridView>

cs文件代码

protected void ClassGridView_RowDeleting(object sender, GridViewDeleteEventArgs e)
        {
            int id = int.Parse(ClassGridView.DataKeys[e.RowIndex].Value.ToString());
            bool tof = false;
            
            tof = SystemColumn.GetSystemColumnClassCountById(id);

            if (tof)
            {
                ShowMessage("该类别含有子类别，请先删除子类别！");
            }
            else
            {
                tof = SystemColumn.DeleteSystemColumnData(id);
                if(tof)
                {
                    ClientScript.RegisterStartupScript(this.GetType(), "message", "<script language='javascript'>alert('删除成功！');</script>");
                    GridViewDataBind(1);         //重新加载数据
                
                }
                else{
                    ClientScript.RegisterStartupScript(this.GetType(), "message", "<script language='javascript'>alert('删除失败！');</script>");
                }
            }
        }