ASP.NET GridView - Add a new record

本文介绍了一种在ASP.NET GridView中实现插入功能的方法,并解决了当数据源为空时不显示的问题。通过简单的代码修改,在Grid顶部预置空白行,用作新记录的编辑行。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Introduction

This code drop is part of a Smash and Grab series for the seriously ADD (Attention Deficit Disorder) programmer. I'll bet there are a lot of other programmers out there who would like to make code available to others, but just don't want to spend the hours required to create a full-blown "CodeProject" article. This is an attempt to see if I can make some useful code available to other programmers, and do it in 10 minutes. I encourage others to contribute to "Smash and Grab".

The point of this series is to present usable pre-canned classes or techniques which solve a real world problem without going into too much detail about how it works. I mean, who really cares about how System.Collections.ArrayList works, you just use it.

Please fully comment the code so that the person who really cares (and has the time) will be able to understand the underlying algorithm.

Using the code

There has been a lot of whining on the net about what a train-wreck the ASP.NET 2.0 GridView is because it won't do inserts and if the table source is empty, the grid does not even render.

Here is a solution in less than 15 lines of code.

  • Create a GridView as usual (I am using the NorthWind Categories table as an example).
  • Create the data source.
  • Change:
    SelectCommand="SELECT [CategoryID], [CategoryName]," + 
                " convert(nvarchar(1000),[Description]) FROM [Categories]";

    to:

    SelectCommand="SELECT '' as [CategoryID], '' as [CategoryName]," + 
             " '' as [Description] UNION SELECT [CategoryID]," + 
             " [CategoryName], convert(nvarchar(1000),[Description])" + 
             " FROM [Categories]";

    This inserts a blank row as the first line of the grid.

    This is the line that you will be editing to add the new record.

  • Add:
    OnRowUpdating="GridView1_RowAdding";

    as an event to the grid (you can do it through the GUI).

  • Add the highlighted JavaScript code.

    It finds the first "Edit Delete" text and changes it to "Add".

  • Add the "GridView1_RowAdding" method.

OnRowUpdating is called by the GridView before it updates a row. The GridView thinks it is doing an update to CategoryID=0 (which will silently fail). Meanwhile, you are scooping the data and doing a secret insert.

Collapse
<%@ Page Language="C#" AutoEventWireup="true" 
             CodeFile="AddUpdate.aspx.cs" Inherits="AddUpdate" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    <script>
    function FixGrid(idGrid)
    {
      // content looks like:
      //"<A href=/"javascript:__doPostBack('GridView1',
      //    'Edit$0')/">Edit</A> 
      // <A href=/"javascript:__doPostBack('GridView1',
      //    'Delete$0')/">Delete</A>"
      // replace Edit with Add, remove Delete
      var Parts = 
       idGrid.firstChild.childNodes[1].childNodes[0].innerHTML.split(">Edit<");
      var tmp = Parts.join(">Add<"); 
      Parts = tmp.split(">Delete<");
      idGrid.firstChild.childNodes[1].childNodes[0].innerHTML = 
                                        Parts.join("><");
    }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:GridView ID="GridView1" runat="server" 
                 AutoGenerateColumns="False" DataKeyNames="CategoryID"
            DataSourceID="SqlDataSource1" 
                    OnRowUpdating="GridView1_RowAdding">
            <Columns>
                <asp:CommandField ShowDeleteButton="True" 
                    ShowEditButton="True" />
                <asp:BoundField DataField="CategoryID" 
                    HeaderText="CategoryID" InsertVisible="False"
                    ReadOnly="True" SortExpression="CategoryID" />
                <asp:BoundField DataField="CategoryName" 
                       HeaderText="CategoryName" 
                       SortExpression="CategoryName" />
                <asp:BoundField DataField="Description" 
                       HeaderText="Description" 
                       SortExpression="Description" />
            </Columns>
        </asp:GridView>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
              ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            DeleteCommand="DELETE FROM [Categories] 
                           WHERE [CategoryID] = @CategoryID"
            InsertCommand="INSERT INTO [Categories] 
                           ([CategoryName], [Description]) 
                           VALUES (@CategoryName, @Description)"
            SelectCommand="SELECT '' as [CategoryID], 
                '' as [CategoryName], '' as [Description]
                UNION SELECT [CategoryID], [CategoryName], 
                convert(nvarchar(1000),[Description])
                FROM [Categories]" 
            UpdateCommand="UPDATE [Categories] SET 
                           [CategoryName] = @CategoryName, 
                           [Description] = @Description 
                           WHERE [CategoryID] = @CategoryID">
            <DeleteParameters>
                <asp:Parameter Name="CategoryID" Type="Int32" />
            </DeleteParameters>
            <UpdateParameters>
                <asp:Parameter Name="CategoryName" Type="String" />
                <asp:Parameter Name="Description" Type="String" />
                <asp:Parameter Name="CategoryID" Type="Int32" />
            </UpdateParameters>
            <InsertParameters>
                <asp:Parameter Name="CategoryName" Type="String" />
                <asp:Parameter Name="Description" Type="String" />
            </InsertParameters>
        </asp:SqlDataSource>
    
    </div>
    </form>
        <script>
            FixGrid(document.all.GridView1);
        </script>
</body>
</html>
Collapse
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class AddUpdate : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void GridView1_RowAdding(object sender, 
                        GridViewUpdateEventArgs e)
    {
        if (e.RowIndex > 0)
            return; // RowIndex=0 is the row we want to insert
        System.Collections.Hashtable h = 
                    new System.Collections.Hashtable();

        foreach (System.Collections.DictionaryEntry x in e.NewValues)
        {
            h[x.Key] = x.Value;
        }
        // you now have the data to insert in a hashtable
        // get it into the database using your
        // usual Data Access Layer methods

    }
}
如果您想在 ASP.NET 页面中实现全选功能,并且想要抽取出选中的记录,可以通过以下步骤实现: 1. 在前端页面中添加一个“全选”复选框和一个“提交”按钮。 2. 使用 JavaScript 在“全选”复选框被选中时,将所有记录的复选框选中。 3. 在后端代码中,在提交按钮的 Click 事件中,检查每个记录的复选框是否被选中,如果选中,则将该记录的信息添加到一个列表中。 4. 使用该列表中的信息进行您需要的操作,比如将选中的记录从数据库中删除或者更新。 下面是一个简单的示例代码,演示如何在 ASP.NET 中实现全选功能并抽取选中的记录: 前端页面: ``` <asp:CheckBox ID="chkSelectAll" runat="server" Text="全选" onclick="SelectAll(this);" /> <asp:GridView ID="gridRecords" runat="server" AutoGenerateColumns="false"> <Columns> <asp:TemplateField> <ItemTemplate> <asp:CheckBox ID="chkSelect" runat="server" /> </ItemTemplate> </asp:TemplateField> <asp:BoundField DataField="RecordId" HeaderText="记录ID" /> <asp:BoundField DataField="RecordName" HeaderText="记录名称" /> </Columns> </asp:GridView> <asp:Button ID="btnSubmit" runat="server" Text="提交" OnClick="btnSubmit_Click" /> ``` JavaScript: ``` function SelectAll(selectAll) { var checkboxes = document.getElementsByTagName('input'); for (var i = 0; i < checkboxes.length; i++) { if (checkboxes[i].type == 'checkbox') { checkboxes[i].checked = selectAll.checked; } } } ``` 后端代码: ``` protected void btnSubmit_Click(object sender, EventArgs e) { List<Record> selectedRecords = new List<Record>(); foreach (GridViewRow row in gridRecords.Rows) { CheckBox chkSelect = (CheckBox)row.FindControl("chkSelect"); if (chkSelect.Checked) { int recordId = int.Parse(row.Cells[1].Text); string recordName = row.Cells[2].Text; selectedRecords.Add(new Record { RecordId = recordId, RecordName = recordName }); } } // 使用 selectedRecords 进行您需要的操作 } public class Record { public int RecordId { get; set; } public string RecordName { get; set; } } ``` 这是一个简单的示例代码,您可以根据您的具体需求进行修改和扩展。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值