第三篇：使用Visual Studio 2008实现基本的页面交互

第三篇：使用Visual Studio 2008实现基本的页面交互

 本系列目录
对第一篇中的数据库做一下修正脚本如下:

Code

下面开始本节内容：

打开上节创建的项目，添加一个新的web页面ModuleManager.aspx。将一个GridView拖动到设计器，将其命名为GridViewModules。在设计视图使用快捷键F7打开代码视图，找到Page_Load函数，完成其中代码。

        SecurityDataContext db;
        protected void Page_Load(object sender, EventArgs e)
        {

            db = new SecurityDataContext();
            if (!IsPostBack)
            {
                BindGrid();
            }
        }
private void BindGrid()
        {
            SecurityDataContext db = new SecurityDataContext();
            this.GridViewModules.DataSource = db.Modules.GetNewBindingList();
            this.GridViewModules.DataBind();
        }

说明：BindGrid实现了GridView的数据绑定。
在属性面板中设置Columns属性，打开Fields窗口如图1.

图1

在图中红色区域选择要添加的列，点击add按钮列将被添加到绿色区域，使用蓝色区域的按钮来对列排列删除。选中绿色区域的列可在紫色区域的属性编辑区设置该列DataField属性。设计完成的的html如下。

        <asp:GridView ID="GridViewModules" runat="server" AutoGenerateColumns="False">
            <Columns>
                <asp:BoundField DataField="Code" HeaderText="Code" />
                <asp:BoundField DataField="Name" HeaderText="Name" />
                <asp:BoundField DataField="Comments" HeaderText="Comments" />
                <asp:CommandField ShowDeleteButton="True" />
                <asp:CommandField ShowEditButton="True" ShowInsertButton="True" />
            </Columns>
        </asp:GridView>

右键点击GridView控件，选择属性，打开属性面板，如图2.

图2

双击红色区域生成RowEditing的事件处理函数。同样的方法生成RowUpdating、RowDeleting、RowCanceling事件处理函数。转到C#代码页面。完成刚才生成的GridViewModules_RowEditing函数，完成代码如下。

        protected void GridViewModules_RowEditing(object sender, GridViewEditEventArgs e)
        {
            this.GridViewModules.EditIndex = e.NewEditIndex;
            BindGrid();
        }

该段代码在点击编辑按钮后将列变为可编辑状态。

        protected void GridViewModules_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
        {
            GridViewModules.EditIndex = -1;
            BindGrid();
        }

说明：重新将可编辑部分置为不可编辑。

protected void GridViewModules_RowUpdating(object sender, GridViewUpdateEventArgs e)
        {
            var a = db.Modules.Where(module => module.ModuleID.ToString() == GridViewModules.DataKeys[e.RowIndex].Values[0].ToString().Trim()).First();
            a.Name = ((TextBox)GridViewModules.Rows[e.RowIndex].Cells[1].Controls[0] as TextBox).Text;
            a.Code = ((TextBox)GridViewModules.Rows[e.RowIndex].Cells[0].Controls[0] as TextBox).Text;
            a.Comments = ((TextBox)GridViewModules.Rows[e.RowIndex].Cells[2].Controls[0] as TextBox).Text;
            db.SubmitChanges();
            GridViewModules.EditIndex = -1;
            BindGrid();
}

说明：更新修改的行。

        protected void GridViewModules_RowDeleting(object sender, GridViewDeleteEventArgs e)
        {
            var a = db.Modules.Where(module => module.ModuleID.ToString() == GridViewModules.DataKeys[e.RowIndex].Values[0].ToString().Trim()).First();
            db.Modules.DeleteOnSubmit(a);
            db.SubmitChanges();
            BindGrid();
        }

说明：删除当前行。
F5执行代码效果如图3

图3

现在还缺少添加功能。
向界面添加3个TextBox控件并设置其ID，再添加一个按钮。其html代码为

        </div>
        <div>Name:<asp:TextBox ID="TextBoxName" runat="server"></asp:TextBox>
        </div>
        <div>Comments:<asp:TextBox ID="TextBoxComments" runat="server"></asp:TextBox>
        </div>
        <div>
            <asp:Button ID="ButtonAdd" runat="server" Text="添加" />
        </div>

为Button添加onclick事件
<asp:Button ID="ButtonAdd" runat="server" Text="添加" onclick="ButtonAdd_Click" />
修改其CS代码
        protected void ButtonAdd_Click(object sender, EventArgs e)
        {
            Modules m = new Modules()
            {
                Code = this.TextBoxCode.Text,
                Name = this.TextBoxName.Text,
                Comments = this.TextBoxComments.Text
            };
            SecurityDataContext db = new SecurityDataContext();
            if (db.Modules.Where(module => module.Code.Trim() == m.Code.Trim()).Count() > 0)//Linq
                throw new Exception("Code不能重复");

            db.Modules.InsertOnSubmit(m);
            db.SubmitChanges();
            BindGrid();
            this.TextBoxCode.Text = "";
            this.TextBoxName.Text = "";
            this.TextBoxComments.Text = "";
        }
这样就完成了对Modules的添加、修改、删除操作。

    预告：第四篇：实现用户注册页面
    主要内容数据验证控件的使用。
相关阅读:
理论四：接口隔离原则有哪三种应用？原则中的“接口”该如何理解？
gunicorn 配置文件
 转载——gunicorn的实践经验
 pympler 模块
 类属性的名称空间
 django——实现事务
 django-apscheduler报错——Run time of job …… next run at: ……)” was missed by
阿里云连接数据库服务
 第十三周总结
 IDEA常用模板
原文地址：https://www.cnblogs.com/tianyamoon/p/1036284.html