Complete a three-tier architecture case-3 from scratch (step 02)

Step 02

2. Operation steps (continue the operation of the previous document)


2.15 Create a new D-tier class library project (MySQL)

Delete the default Class1.cs, and then modify the assembly name and default namespace name.
image.png

Create a new DLayer class
image.png

Add a reference to the Entity project
image.png

Add a reference to MySQL (this step requires MySQL to be installed successfully)
  C:\Program Files (x86)\MySQL\Connector.NET 6.9\Assemblies\v4.5
image.png

image.png

image.png

Create a new database and data table on MySQL WorkBench
image.png

Similarly, add test data.
image.png

After modifying the code of DLayer.cs of the new project
and introducing the required namespace, just copy the original DLayer code of the D-layer project of SQLserver directly, and then modify conn, comm and dataadapter to the corresponding MySQL classes. .
image.png

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

using System.Data;
using MySql.Data.MySqlClient;
using YYYDemo.Entity;

namespace YYYDemo.P_DLayer_MySQL
{
    
    
    public class DLayer
    {
    
    
        //创建数据库连接
        private MySqlConnection CreateConnection()
        {
    
    
            return new MySqlConnection(
                "Database=数据库名称;DataSource=127.0.0.1;User=root;Pwd=root;port=3306"
                );
        }
        //获取全部的账户信息,以Owner实体类类型返回
        public IList<Owner> GetAllAccount()
        {
    
    
            List<Owner> owners = new List<Owner>();

            MySqlConnection conn = CreateConnection();
            conn.Open();
            MySqlDataAdapter dAdp = new MySqlDataAdapter(
                "SELECT * FROM owner", conn
                );
            DataSet dSet = new DataSet();
            dAdp.Fill(dSet, "owner");
            for (int i = 0; i < dSet.Tables[0].Rows.Count; i++)
            {
    
    
                Owner owner = new Owner();
                owner.Oid = Convert.ToInt32(dSet.Tables[0].Rows[i][0].ToString());
                owner.Name = dSet.Tables[0].Rows[i][1].ToString();
                owner.Sex = Convert.ToChar(dSet.Tables[0].Rows[i][2].ToString());
                owner.Phone = dSet.Tables[0].Rows[i][3].ToString();
                owner.BuildNum = dSet.Tables[0].Rows[i][4].ToString();
                owner.Unit = dSet.Tables[0].Rows[i][5].ToString();
                owner.RoomNum = dSet.Tables[0].Rows[i][6].ToString();
                owners.Add(owner);
            }
            conn.Close();
            return owners;
        }
        //添加一个账户
        public void AddAnAccount(Owner owner)
        {
    
    
            MySqlConnection conn = CreateConnection();
            MySqlCommand cmd = new MySqlCommand(
                string.Format(
                "INSERT INTO owner(name,sex,phone,buildnum,unit,roomnum) " +
                "VALUES(N'{0}','{1}',N'{2}',N'{3}',N'{4}',N'{5}')"
                , owner.Name, owner.Sex, owner.Phone, owner.BuildNum, owner.Unit, owner.RoomNum),
                conn
                );
            try
            {
    
    
                conn.Open();
                cmd.ExecuteNonQuery();
            }
            catch (Exception e)
            {
    
    
                throw e;
            }
            finally
            {
    
    
                conn.Close();
            }
        }
        //通过手机号获得一个账户的信息,以Owner实体类类型返回;
        //这个函数是为了在B层通过手机号获取账户的id
        public Owner GetAnAccountByPhone_TO_Owner(string phone)
        {
    
    
            MySqlConnection conn = CreateConnection();
            conn.Open();
            MySqlDataAdapter dAdp = new MySqlDataAdapter(
                string.Format("SELECT * FROM owner WHERE phone=N'{0}'", phone),
                conn);
            DataSet dSet = new DataSet();
            dAdp.Fill(dSet, "owner");

            Owner owner = new Owner();
            owner.Oid = Convert.ToInt32(dSet.Tables[0].Rows[0][0].ToString());
            owner.Name = dSet.Tables[0].Rows[0][1].ToString();
            owner.Sex = Convert.ToChar(dSet.Tables[0].Rows[0][2].ToString());
            owner.Phone = dSet.Tables[0].Rows[0][3].ToString();
            owner.BuildNum = dSet.Tables[0].Rows[0][4].ToString();
            owner.Unit = dSet.Tables[0].Rows[0][5].ToString();
            owner.RoomNum = dSet.Tables[0].Rows[0][6].ToString();
            conn.Close();
            return owner;
        }
        //通过id获得一个账户的信息,以Owner实体类类型返回
        public Owner GetAnAccountByIndex_TO_Owner(int index)
        {
    
    
            MySqlConnection conn = CreateConnection();
            conn.Open();
            MySqlDataAdapter dAdp = new MySqlDataAdapter(
                string.Format("SELECT * FROM owner WHERE Oid={0}", index),
                conn);
            DataSet dSet = new DataSet();
            dAdp.Fill(dSet, "owner");

            Owner owner = new Owner();
            owner.Oid = Convert.ToInt32(dSet.Tables[0].Rows[0][0].ToString());
            owner.Name = dSet.Tables[0].Rows[0][1].ToString();
            owner.Sex = Convert.ToChar(dSet.Tables[0].Rows[0][2].ToString());
            owner.Phone = dSet.Tables[0].Rows[0][3].ToString();
            owner.BuildNum = dSet.Tables[0].Rows[0][4].ToString();
            owner.Unit = dSet.Tables[0].Rows[0][5].ToString();
            owner.RoomNum = dSet.Tables[0].Rows[0][6].ToString();
            conn.Close();
            return owner;
        }
        //修改一行信息
        public void UpdateAnAccount(Owner owner)
        {
    
    
            MySqlConnection conn = CreateConnection();
            MySqlCommand cmd = new MySqlCommand(
                string.Format(
                    "UPDATE owner SET name=N'{0}',sex='{1}',phone=N'{2}',buildnum=N'{3}',unit=N'{4}',roomnum=N'{5}' " +
                    "WHERE Oid={6}; ", owner.Name, owner.Sex, owner.Phone, owner.BuildNum, owner.Unit, owner.RoomNum, owner.Oid),
                conn
                );
            try
            {
    
    
                conn.Open();
                cmd.ExecuteNonQuery();
            }
            catch (Exception e)
            {
    
    
                throw e;
            }
            finally
            {
    
    
                conn.Close();
            }
        }
        //删除一行信息
        public void DeleteAnAccount(int index)
        {
    
    
            MySqlConnection conn = CreateConnection();
            MySqlCommand cmd = new MySqlCommand(
                string.Format("DELETE FROM owner WHERE Oid = {0}", index),
                conn);
            try
            {
    
    
                conn.Open();
                cmd.ExecuteNonQuery();
            }
            catch (Exception e)
            {
    
    
                throw e;
            }
            finally
            {
    
    
                conn.Close();
            }
        }
    }
}

2.16 Modify web.config and set the output path of two D-layer projects

image.png
Before modification:
image.png

Modify it as shown in the figure below:
 
 
image.png

Modify the output path of the two D layer projects


After reading a comment, explain the output path problem here.

image.png

image.png


image.png

2.17 Create a new class library project DAction (abstract data access layer project)

Add a reference to the Entity project
image.png

Modify the assembly name and default namespace
image.png

Add a new class (DAction_Class) and delete the original Class1.cs
(Note: The newly created class here actually needs to be modified to the interface type, so it is not very reasonable for me to name it DAction_Class here)
image.png

Modify the code of DAction_Class
image.png

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

using YYYDemo.Entity;

namespace YYYDemo.DAction
{
    
    
    public interface DAction_Class
    {
    
    
        IList<Owner> GetAllAccount();
        void AddAnAccount(Owner owner);
        Owner GetAnAccountByPhone_TO_Owner(string phone);
        Owner GetAnAccountByIndex_TO_Owner(int index);
        void UpdateAnAccount(Owner owner);
        void DeleteAnAccount(int index);
    }
}

2.18 Create a new class library project DFactory (data access layer factory)

image.png

Modify the assembly name and default namespace
image.png

Delete the original Class1.cs and create a new class DFactory_Class
image.png

Add a reference to the DAction project
image.png

Add the references shown in the image below:
image.png

Edit the code of DFactory_Class.cs

Author: Bboy-AJ-Ren Jie  
Source: CSDN  
Original: https://blog.csdn.net/u013201439/article/details/51161230


 

Don't follow what the textbook says, it won't work. I searched here for a long time, only to solve this problem.

image.png

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

using System.Configuration;
using YYYDemo.DAction;
using System.Reflection;

namespace YYYDemo.DFactory
{
    
    
    public sealed class DFactory_Class//数据访问层工厂
    {
    
    
        private DFactory_Class() {
    
     }//数据访问层工厂构造器
        public static DAction_Class DriveDLayer()
        {
    
    
            string path = ConfigurationManager.AppSettings["DAL"];
            string className = path + ".DLayer";
            return Assembly.Load(path).CreateInstance(className) as DAction_Class;
        }
    }
}

2.19 Modify the code of the two data access layers

First let both D layer projects add references to the DAction project
image.png

The DLayer.cs code of the P_DLayer_MySQL project:
just after introducing the namespace, let it inherit from this interface named DAction_Class
image.png

DLayer.cs code of P_DLayer project: (same operation)
image.png

2.20 Modify the B-layer project

Modify the reference added for it, before modification:
image.png

After modification: (Note that the reference to the P_DLayer project is removed here)
image.png

Modifying the code of BLayer.cs
image.png
is to add a function of DAction interface type, and change the previous reference to the class of the D-layer project into a reference to the interface type variable.

The references in the following functions have changed. The two verification functions did not call the D-layer code before, so there is no need to change.
image.png

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

//using YYYDemo.P_DLayer;
using System.Text.RegularExpressions;//正则表达式
using System.Runtime.InteropServices;//为了实现一个弹窗
using YYYDemo.Entity;
using YYYDemo.DAction;
using YYYDemo.DFactory;

namespace YYYDemo.P_BLayer
{
    
    
    public class BLayer
    {
    
    
        private DAction_Class DriveDLayer()
        {
    
    
            return DFactory_Class.DriveDLayer();
        }

        //提示框,这两行照着写上即可,不必理解原理,会使用就行
        [DllImport("User32.dll", SetLastError = true, ThrowOnUnmappableChar = true, CharSet = CharSet.Auto)]
        public static extern int MessageBox(IntPtr handle, String message, String title, int type);
        public IList<Owner> GetAllAccount()
        {
    
    
            //return new DLayer().GetAllAccount();
            return DriveDLayer().GetAllAccount();
        }
        string errorStr = "";//这个也可以设置成局部变量,只不过让RegularCheck_Add(Update)_TO_Bool函数多传递一个参数而已。
        //添加账户时正则表达式对输入数据的验证
        private bool RegularCheck_Add_TO_Bool(Owner _owner)
        {
    
    
            errorStr = "";
            bool flag = true;
            string rStr_Name = "^[\u4e00-\u9fa5]{2,4}$";//2-4个中文
            string rStr_Phone = @"^\d{11}$";//11位数字
            string rStr_BuildNum_Unit_RoomNum = @"^\d{1,3}$";//1-3位数字

            if (!Regex.IsMatch(_owner.Name, rStr_Name))
            {
    
    
                errorStr += "姓名应为2-4个汉字!\n";
                flag = false;
            }
            if (!Regex.IsMatch(_owner.Phone, rStr_Phone))
            {
    
    
                errorStr += "号码应为11位数字!\n";
                flag = false;
            }
            if (!Regex.IsMatch(_owner.BuildNum, rStr_BuildNum_Unit_RoomNum))
            {
    
    
                errorStr += "楼号应为1-3位数字!\n";
                flag = false;
            }
            if (!Regex.IsMatch(_owner.Unit, rStr_BuildNum_Unit_RoomNum))
            {
    
    
                errorStr += "单元号应为1-3位数字!\n";
                flag = false;
            }
            if (!Regex.IsMatch(_owner.RoomNum, rStr_BuildNum_Unit_RoomNum))
            {
    
    
                errorStr += "房间号应为1-3位数字!\n";
                flag = false;
            }

            var owners = GetAllAccount();

            bool equal_Phone = false;
            bool equal_Position = false;

            for (int i = 0; i < owners.Count; i++)
            {
    
    

                if (_owner.Phone == owners[i].Phone)
                    equal_Phone = true;

                if (
                    _owner.BuildNum == owners[i].BuildNum &&
                    _owner.Unit == owners[i].Unit &&
                    _owner.RoomNum == owners[i].RoomNum
                    )
                    equal_Position = true;
            }
            if (equal_Phone)
            {
    
    
                errorStr += "联系电话不能重复!\n";
                flag = false;
            }
            if (equal_Position)
            {
    
    
                errorStr += "住房位置不能重复!\n";
                flag = false;
            }
            
            return flag;
        }
        //添加一个账户
        public string AddAnAccount(Owner owner)
        {
    
    
            if (RegularCheck_Add_TO_Bool(owner))
            {
    
    
                errorStr = "新增业主信息成功!";
                DriveDLayer().AddAnAccount(owner);
            }
            else
                errorStr += "\n新增业主信息失败!";
            return errorStr;
        }
        //通过手机号获取该行数据的索引,在U层中为下面的GetAnAccountByIndex_TO_DataSet()函数提供作用
        public int GetIndexByPhone_TO_Int(string phone)
        {
    
    
            return Convert.ToInt32(
                DriveDLayer().GetAnAccountByPhone_TO_Owner(phone).Oid);
        }
        //通过索引获取该行数据的全部信息,以Owner实体类类型返回
        public Owner GetAnAccountBydIndex_TO_Owner(int index)
        {
    
    
            return DriveDLayer().GetAnAccountByIndex_TO_Owner(index);
        }
        //修改账户时正则表达式对输入数据的验证
        //修改个人信息,需要验证 手机号 和 住房位置 是否 *跟别人* 重复;还需验证数据是否合理
        private bool RegularCheck_Update_TO_Bool(Owner _owner)
        {
    
    
            errorStr = "";
            bool flag = true;
            string rStr_Name = "^[\u4e00-\u9fa5]{2,4}$";
            string rStr_Phone = @"^\d{11}$";
            string rStr_BuildNum_Unit_RoomNum = @"^\d{1,3}$";

            if (!Regex.IsMatch(_owner.Name, rStr_Name))
            {
    
    
                errorStr += "姓名应为2-4个汉字!\n";
                flag = false;
            }
            if (!Regex.IsMatch(_owner.Phone, rStr_Phone))
            {
    
    
                errorStr += "号码应为11位数字!\n";
                flag = false;
            }
            if (!Regex.IsMatch(_owner.BuildNum, rStr_BuildNum_Unit_RoomNum))
            {
    
    
                errorStr += "楼号应为1-3位数字!\n";
                flag = false;
            }
            if (!Regex.IsMatch(_owner.Unit, rStr_BuildNum_Unit_RoomNum))
            {
    
    
                errorStr += "单元号应为1-3位数字!\n";
                flag = false;
            }
            if (!Regex.IsMatch(_owner.RoomNum, rStr_BuildNum_Unit_RoomNum))
            {
    
    
                errorStr += "房间号应为1-3位数字!\n";
                flag = false;
            }
            
            var owners = GetAllAccount();

            bool equal_Phone = false;
            bool equal_Position = false;

            for (int i = 0; i < owners.Count; i++)
            {
    
    
                if (owners[i].Oid != _owner.Oid)
                {
    
    
                    if (_owner.Phone == owners[i].Phone)
                        equal_Phone = true;

                    if (
                        _owner.BuildNum == owners[i].BuildNum &&
                        _owner.Unit == owners[i].Unit &&
                        _owner.RoomNum == owners[i].RoomNum
                        )
                        equal_Position = true;
                }

            }
            if (equal_Phone)
            {
    
    
                errorStr += "联系电话不能重复!\n";
                flag = false;
            }
            if (equal_Position)
            {
    
    
                errorStr += "住房位置不能重复!\n";
                flag = false;
            }
            
            return flag;
        }
        //修改一个账户的信息
        public string UpdateAnAccount(Owner owner)
        {
    
    
            if (RegularCheck_Update_TO_Bool(owner))
            {
    
    
                errorStr = "修改业主信息成功!";
                DriveDLayer().UpdateAnAccount(owner);
            }
            else
                errorStr += "\n修改业主信息失败!";
            return errorStr;
        }
        //删除一个账户
        public string DeleteAnAccount(int index)
        {
    
    
            errorStr = "删除业主信息成功!";
            DriveDLayer().DeleteAnAccount(index);
            return errorStr;
        }

    }
}

It is best to regenerate the solution after modifying the code.

When switching databases in the future, you only need to display the values ​​of the required databases in web.config, and hide the values ​​of other databases.
image.png

Here the MySQL database is used to run the tests.
image.png
Operating normally.

Reference relationship diagram between projects so far:
 
image.png


dividing line three

Before that, in 2.15-2.20, the support for different databases was completed, and the production of hematemesis was completed. It's been a night.

2019-5-24 20:50:36


2.21 Add theme folder

2019-5-28 10:24:10
image.png

image.png

image.png

image.png

2.22 Modify the property style setting of GridView in ShowAll.aspx

Go back to the ShowAll.aspx page and modify the style of GridView
①: modify the format
image.png

image.png

image.png

②: Center setting of all columns
image.png

Center all fields as follows. (The setting of the style through the attribute will be mapped to the .aspx code)
image.png

③: On the property panel of GridView in the design panel, make the following settings:
image.png

image.png

④:
Now in the design interface of VS, it is displayed as shown in the figure below:
image.png

Source code:
first add a SkinID to GridView
image.png

<asp:GridView SkinID="ShowAll_GridView" ID="gView" runat="server"
                AllowPaging="True"
                AutoGenerateColumns="False" OnPageIndexChanging="gView_PageIndexChanging"
                OnRowCommand="gView_RowCommand"
                CellPadding="4" ForeColor="#333333" GridLines="None"
                Font-Names="楷体" Font-Size="16pt" HorizontalAlign="Center" Width="100%"
                >
                <AlternatingRowStyle BackColor="White" />
                <Columns>
                    <asp:BoundField DataField="Name" HeaderText="姓名" SortExpression="Name" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="Sex" HeaderText="性别" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="Phone" HeaderText="联系电话" SortExpression="Phone" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="BuildNum" HeaderText="楼号" SortExpression="BuildNum" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="Unit" HeaderText="单元" SortExpression="Unit" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="RoomNum" HeaderText="房间号" SortExpression="RoomNum" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>

                    <asp:ButtonField CommandName="Y_Update" HeaderText="操作" ShowHeader="True" Text="修改">
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:ButtonField>
                    <asp:ButtonField CommandName="Y_Delete" HeaderText="操作" ShowHeader="True" Text="删除" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:ButtonField>
                </Columns>
                <FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
                <RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
                <SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
                <SortedAscendingCellStyle BackColor="#FDF5AC" />
                <SortedAscendingHeaderStyle BackColor="#4D0000" />
                <SortedDescendingCellStyle BackColor="#FCF6C0" />
                <SortedDescendingHeaderStyle BackColor="#820000" />
            </asp:GridView>

Copy the selected code above to the Skin1 file, but delete and and  
the code in the Skin1.skin file is as follows:

<asp:GridView SkinID="ShowAll_GridView" runat="server"
                AllowPaging="True"
                AutoGenerateColumns="False" 
                CellPadding="4" ForeColor="#333333" GridLines="None"
                Font-Names="楷体" Font-Size="16pt" HorizontalAlign="Center" Width="100%"
                >
                <AlternatingRowStyle BackColor="White" />
                <Columns>
                    <asp:BoundField DataField="Name" HeaderText="姓名" SortExpression="Name" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="Sex" HeaderText="性别" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="Phone" HeaderText="联系电话" SortExpression="Phone" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="BuildNum" HeaderText="楼号" SortExpression="BuildNum" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="Unit" HeaderText="单元" SortExpression="Unit" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="RoomNum" HeaderText="房间号" SortExpression="RoomNum" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>

                    <asp:ButtonField CommandName="Y_Update" HeaderText="操作" ShowHeader="True" Text="修改">
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:ButtonField>
                    <asp:ButtonField CommandName="Y_Delete" HeaderText="操作" ShowHeader="True" Text="删除" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:ButtonField>
                </Columns>
                <FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
                <RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
                <SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
                <SortedAscendingCellStyle BackColor="#FDF5AC" />
                <SortedAscendingHeaderStyle BackColor="#4D0000" />
                <SortedDescendingCellStyle BackColor="#FCF6C0" />
                <SortedDescendingHeaderStyle BackColor="#820000" />
            </asp:GridView>

Then cancel the style modification on the ShowAll.aspx page (because the style is separated from the page, there should be no style settings on the page)
image.png

In the line of code in the image below, add the Theme attribute
image.png

Code for ShowAll.aspx so far

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ShowAll.aspx.cs"
    Inherits="P_ULayer.ShowAll" Theme="主题1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>小区业主列表</title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            
            <div id="Div_lbl_Topic">
                <asp:Label runat="server" ID="lbl_Topic" Text="小 区 业 主 列 表"></asp:Label>
            </div>

            <!--<div>
                <asp:Button ID="btn1" runat="server" Text="  1  " OnClick="btn1_Click" />
                <asp:Button ID="btn2" runat="server" Text="  2  " OnClick="btn2_Click" />
            </div>-->

            <div>
                <br /><br />
                <asp:HyperLink Target="_self" NavigateUrl="~/AddAccount.aspx" runat="server" ID="hLink_AddAccount" Text="新增业主"></asp:HyperLink>
                <br /><br /><br /><br />
            </div>

            <asp:GridView SkinID="ShowAll_GridView" ID="gView" runat="server"
                AllowPaging="True"
                AutoGenerateColumns="False"
                OnPageIndexChanging="gView_PageIndexChanging"
                OnRowCommand="gView_RowCommand">
                <Columns>
                    <asp:BoundField DataField="Name" HeaderText="姓名" SortExpression="Name" />
                    <asp:BoundField DataField="Sex" HeaderText="性别" />
                    <asp:BoundField DataField="Phone" HeaderText="联系电话" SortExpression="Phone" />
                    <asp:BoundField DataField="BuildNum" HeaderText="楼号" SortExpression="BuildNum" />
                    <asp:BoundField DataField="Unit" HeaderText="单元" SortExpression="Unit" />
                    <asp:BoundField DataField="RoomNum" HeaderText="房间号" SortExpression="RoomNum" />

                    <asp:ButtonField CommandName="Y_Update" HeaderText="操作" ShowHeader="True" Text="修改" />
                    <asp:ButtonField CommandName="Y_Delete" HeaderText="操作" ShowHeader="True" Text="删除" />
                </Columns>
            </asp:GridView>
        </div>
    </form>
</body>
</html>

2.23 Adding CSS to Theme 1

Under the theme 1 folder, add a CSS style sheet, and drag in a picture as a background image
image.png

Modify StyleSheet1.css:

body {
    
    
    width: 100%;
    background-attachment: fixed;
    background-image: url(BgImage3.jpg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

#form1 {
    
    
    width: 60%;
    margin: 0 auto;
    font-family: "楷体";
}

#Div_lbl_Topic {
    
    
    margin: 5% auto 0;
    width: 80%;
    font-size: 80px;
    text-align: center;
    color: cyan;
}

#hLink_AddAccount {
    
    
    font-size: 36px;
    color: blue;
    float: right;
}

Run the test:
image.png

Now the style setting of the ShowAll.aspx page has been completed through the property setting of css and aspx, and the following is the style setting of the content page.

2.24 Styling content pages

When designing before, the font 16 style was set for the TextBox control of the master page, and now all are deleted
image.png

Continue to modify the CSS style
image.png

#hLink_AddAccount {
    
    
    font-size: 36px;
    color: blue;
    float: right;
}

/*上面为ShowAll*/

body {
    
    
    width: 100%;
    background-attachment: fixed;
    background-image: url(BgImage3.jpg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
#form1 {
    
    
    width: 60%;
    margin: 0 auto;
    font-family: "楷体";
}
#Div_lbl_Topic { 
    margin: 5% auto 0;
    width: 80%;
    font-size: 80px;
    text-align: center;
    color: cyan;
}

/*下面为两个内容页*/
#Div_hLink_TO_01 {
    
    
    font-size: 40px;
    margin-left: 5%;
    margin-top: 2%;
}
#tableUI {
    
    
    font-size: 30px;
    font-family: "楷体";
    margin: 0 auto;
    width: 100%;
}
.td_Left {
    
    
    text-align: right;
}
#Div_btnSubmit {
    
    
    margin: 0 auto;
    width: 100px;
}
.CSS_class_btnSubmit {
    
    
    font-size: 32px;
    font-family: "楷体";
    color: black;
    background-color: cyan;
}



Modify Skin1.skin
image.png

<asp:GridView SkinID="ShowAll_GridView" runat="server"
                AllowPaging="True"
                AutoGenerateColumns="False" 
                CellPadding="4" ForeColor="#333333" GridLines="None"
                Font-Names="楷体" Font-Size="16pt" HorizontalAlign="Center" Width="100%"
                >
                <AlternatingRowStyle BackColor="White" />
                <Columns>
                    <asp:BoundField DataField="Name" HeaderText="姓名" SortExpression="Name" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="Sex" HeaderText="性别" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="Phone" HeaderText="联系电话" SortExpression="Phone" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="BuildNum" HeaderText="楼号" SortExpression="BuildNum" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="Unit" HeaderText="单元" SortExpression="Unit" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>
                    <asp:BoundField DataField="RoomNum" HeaderText="房间号" SortExpression="RoomNum" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:BoundField>

                    <asp:ButtonField CommandName="Y_Update" HeaderText="操作" ShowHeader="True" Text="修改">
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:ButtonField>
                    <asp:ButtonField CommandName="Y_Delete" HeaderText="操作" ShowHeader="True" Text="删除" >
                    <ItemStyle HorizontalAlign="Center" />
                    </asp:ButtonField>
                </Columns>
                <FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
                <RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
                <SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
                <SortedAscendingCellStyle BackColor="#FDF5AC" />
                <SortedAscendingHeaderStyle BackColor="#4D0000" />
                <SortedDescendingCellStyle BackColor="#FCF6C0" />
                <SortedDescendingHeaderStyle BackColor="#820000" />
            </asp:GridView>


<asp:TextBox Font-Size="16pt" Font-Names="楷体" runat="server"></asp:TextBox>

Then add the Theme attribute to the first line of code on both content pages
image.png

image.png

Run the test:
image.png

image.png

image.png

2.25 Feel free to add a few more topics

Just set it casually here, just save it in a different theme folder (as shown in the figure below), and then modify the Theme property of the three pages of ShowAll.aspx AddAccount.aspx AlterAccount.aspx to "Theme 2"
image.png

image.png

The picture below is the theme 2 I set up:
image.png

image.png

image.png

2.26 Realize dynamic switching of themes

Modify the code of ShowAll.aspx
image.png

Then modify the style of the newly added control in the Css of the two themes
image.png

image.png

Modify the code in ShowAll.aspx.cs.
image.png

Modify the code in AlterAccount.aspx.cs.image.png

Modify the code in AddAccount.aspx.cs.image.png

2019-5-28 14:03:31

Run the test: (you can test the jump yourself)
image.png

I am normal here. 2019-5-28 19:27:54


dividing line four

2019-5-30 00:27:15
I modified the style slightly and added a theme, now there are three themes in total.
Because the project report is due, and because there is not much time, it is very likely that it will be the final version. Functions that have not been added, such as uploading pictures as avatars and multiple choices, may not be added, but maybe. . .


Guess you like

Origin blog.csdn.net/qq_41286942/article/details/101980889