首先创建项目
选择空的
接着进入
安装jQuery包
添加web窗体
将图片添加到项目中,新建文件夹,重命名为bb
1.菜单导航设计
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %>
<!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>
<h1>导航栏</h1>
<asp:ImageMap ID="imapNav" runat="server" ImageUrl="~/bb/nav_map.png">
<asp:RectangleHotSpot Bottom="26" Right="76"
NavigateUrl="http://jw.dhu.edu.cn"/>
<asp:RectangleHotSpot Bottom="26" Left="72" Right="141"
NavigateUrl="http://research.dhu.edu.cn"/>
<asp:RectangleHotSpot Bottom="26" Left="143" Right="214" />
<asp:RectangleHotSpot Bottom="26" Left="216" Right="287" />
</asp:ImageMap>
</div>
</form>
</body>
</html>
运行截图
2.用户注册
进入Web.config配置添加代码
<appSettings>
<add key="ValidationSettings:UnobtrusiveValidationMode" value="None" />
</appSettings>
再次新建web窗体
引入script文件
<script src="~/Scripts/jquery-3.7.1.js"></script>
注意不要掉了"~/"中的符号,复制完可能会出现多余的空格,删掉即可
<form id="form1" runat="server">
<div>
<h1>用户注册</h1>
姓名:<asp:TextBox ID="txtName" runat="server">李梦为</asp:TextBox>
<asp:RequiredFieldValidator ID="rfvName1" runat="server"
ControlToValidate="txtName">*</asp:RequiredFieldValidator>
<asp:RequiredFieldValidator ID="rfvName2" runat="server"
ControlToValidate="txtName" InitialValue="您的姓名" >不能与初始值相同!
</asp:RequiredFieldValidator>
<br />
性别:<asp:DropDownList ID="Gender" runat="server">
<asp:ListItem>男</asp:ListItem>
<asp:ListItem>女</asp:ListItem>
</asp:DropDownList>
<br />
密码: <asp:TextBox ID="txtPassword" runat="server" TextMode="Password">
</asp:TextBox><br />
确认密码:<asp:TextBox ID="txtPasswordAgain" runat="server" TextMode="Password">
</asp:TextBox>
<asp:CompareValidator ID="cvPassword" runat="server" ControlToCompare="txtPassword"
ControlToValidate="txtPasswordAgain" Display="Dynamic" ForeColor="Red">密码与确认密码不一致</asp:CompareValidator>
<br />
电话号码: <asp:TextBox ID="txtPhone" runat="server"></asp:TextBox>
<asp:RegularExpressionValidator ID="revPhone" runat="server" ControlToValidate="txtPhone"
ErrorMessage="无效的电话号码" ValidationExpression="^\d{11}$" Display="Dynamic" ForeColor="Red">
</asp:RegularExpressionValidator>
<br />
<asp:Button ID="btnRegister" runat="server" Text="注册" OnClick="btnRegister_Click" />
</div>
</form>
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication1.WebForm2" %>
<!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>
<h1>用户注册</h1>
姓名:<asp:TextBox ID="txtName" runat="server">李梦为</asp:TextBox>
<asp:RequiredFieldValidator ID="rfvName1" runat="server"
ControlToValidate="txtName">*</asp:RequiredFieldValidator>
<asp:RequiredFieldValidator ID="rfvName2" runat="server"
ControlToValidate="txtName" InitialValue="您的姓名" >不能与初始值相同!
</asp:RequiredFieldValidator>
<br />
性别:<asp:DropDownList ID="Gender" runat="server">
<asp:ListItem>男</asp:ListItem>
<asp:ListItem>女</asp:ListItem>
</asp:DropDownList>
<br />
密码: <asp:TextBox ID="txtPassword" runat="server" TextMode="Password">
</asp:TextBox><br />
确认密码:<asp:TextBox ID="txtPasswordAgain" runat="server" TextMode="Password">
</asp:TextBox>
<asp:CompareValidator ID="cvPassword" runat="server" ControlToCompare="txtPassword"
ControlToValidate="txtPasswordAgain" Display="Dynamic" ForeColor="Red">密码与确认密码不一致</asp:CompareValidator>
<br />
电话号码: <asp:TextBox ID="txtPhone" runat="server"></asp:TextBox>
<asp:RegularExpressionValidator ID="revPhone" runat="server" ControlToValidate="txtPhone"
ErrorMessage="无效的电话号码" ValidationExpression="^\d{11}$" Display="Dynamic" ForeColor="Red">
</asp:RegularExpressionValidator>
<br />
<asp:Button ID="btnRegister" runat="server" Text="注册" OnClick="btnRegister_Click" />
</div>
</form>
</body>
</html>
给按钮添加点击事件
运行截图
if (Page.IsValid)
{
// 如果表单验证通过,则执行注册逻辑
string name = txtName.Text;
string gender = Gender.SelectedValue;
string password = txtPassword.Text;
string phoneNumber = txtPhone.Text;
// 执行注册操作...
string script = "alert('注册成功!');";
ClientScript.RegisterStartupScript(this.GetType(), "RegistrationSuccessScript", script, true);
}
3.数据库设计
添加数据库
确认是
添加新表
点击更新保存,刷新
添加表数据
添加完成后点击更新
table表
CREATE TABLE [dbo].[Table] (
[CategoryId] INT NOT NULL,
[Name] NCHAR (10) NULL,
[Descn] NCHAR (10) NULL,
PRIMARY KEY CLUSTERED ([CategoryId] ASC)
);
test313表
CREATE TABLE [dbo].[test313] (
[Id] INT NOT NULL,
[name] NCHAR (10) NULL,
[price] NCHAR (10) NULL,
[number] NCHAR (10) NULL,
[dec] NCHAR (10) NULL,
PRIMARY KEY CLUSTERED ([Id] ASC)
);
添加ADO.NET实体模型
完成后等待一下出现这一个文件即可
新建窗体
选着第二个LINQ
找到创建的数据库
找到建立的表
删除绑定的id
添加数据库对象和添加点击事件
第一个点击事件
第二个点击事件
运行截图
4.商品数据显示
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs" Inherits="WebApplication2.WebForm3" %>
<!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>
<h1>商品数据显示</h1>
<asp:GridView ID="GridView1" runat="server"
AutoGenerateColumns="false" OnSelectedIndexChanged="GridView1_SelectedIndexChanged1">
<Columns>
<asp:ButtonField DataTextField="CategoryId" HeaderText="CategoryId" SortExpression="CategoryId" />
<asp:ButtonField DataTextField="Name" HeaderText="Name" SortExpression="Name" />
<asp:ButtonField DataTextField="Descn" HeaderText="Descn" SortExpression="Descn" />
</Columns>
</asp:GridView>
<asp:LinqDataSource ID="LinqDataSource1" runat="server"
ContextTypeName="WebApplication2.Database1Entities" EntityTypeName="" TableName="Table">
</asp:LinqDataSource>
<asp:Button ID="Button1" runat="server" Text="显示" OnClick="Button1_Click" />
<asp:Button ID="Button2" runat="server" Text="选择" OnClick="Button2_Click" />
</div>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebApplication2
{
public partial class WebForm3 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
GridView1.DataBind();
Bind();
}
}
protected void Button1_Click(object sender, EventArgs e)
{Database1Entities db = new Database1Entities();
var results = db.Table.Select(p => new
{
p.CategoryId,
p.Name,
p.Descn
});
GridView1.DataSource= results.ToList();
GridView1.DataBind();
}
protected void GridView1_SelectedIndexChanged1(object sender, EventArgs e)
{
Bind();
}
private void Bind()
{
}
protected void Button2_Click(object sender, EventArgs e)
{
Database1Entities db = new Database1Entities();
var results = db.Table.Where(p => p.CategoryId > 2);
GridView1.DataSource = results.ToList();
GridView1.DataBind();
}
}
}
5.商品数据查询
新建第四个web窗体
<form id="form1" runat="server">
<div>
<h1>商品数据查询</h1>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" >
<Columns>
<asp:BoundField DataField="Id" HeaderText="Id" SortExpression="Id" />
<asp:BoundField DataField="name" HeaderText="name" SortExpression="name" />
<asp:BoundField DataField="price" HeaderText="price" SortExpression="price" />
<asp:BoundField DataField="number" HeaderText="number" SortExpression="number" />
<asp:BoundField DataField="dec" HeaderText="dec" SortExpression="dec" />
</Columns>
</asp:GridView>
<asp:LinqDataSource ID="LinqDataSource1" runat="server" ContextTypeName="WebApplication1.Database1Entities1" EntityTypeName="" TableName="test313">
</asp:LinqDataSource>
<asp:Button ID="Button1" runat="server" Text="显示数据" OnClick="Button1_Click" style="height: 27px" />
<asp:Button ID="Button2" runat="server" Text="降序排序" OnClick="Button2_Click" />
<asp:Button ID="Button3" runat="server" Text="按好吃分组" OnClick="Button3_Click" />
<asp:Button ID="Button4" runat="server" Text="查找最大值" OnClick="Button4_Click" />
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
</form>
是这样的
第一个点击事件
第二个点击事件
第三个点击事件
第四个点击事件
运行截图
按数量降序排列
按好吃的分组,查找最大价格为60
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="WebApplication1.WebForm4" %>
<!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>
<h1>商品数据查询</h1>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" >
<Columns>
<asp:BoundField DataField="Id" HeaderText="Id" SortExpression="Id" />
<asp:BoundField DataField="name" HeaderText="name" SortExpression="name" />
<asp:BoundField DataField="price" HeaderText="price" SortExpression="price" />
<asp:BoundField DataField="number" HeaderText="number" SortExpression="number" />
<asp:BoundField DataField="dec" HeaderText="dec" SortExpression="dec" />
</Columns>
</asp:GridView>
<asp:LinqDataSource ID="LinqDataSource1" runat="server" ContextTypeName="WebApplication1.Database1Entities1" EntityTypeName="" TableName="test313">
</asp:LinqDataSource>
<asp:Button ID="Button1" runat="server" Text="显示数据" OnClick="Button1_Click" style="height: 27px" />
<asp:Button ID="Button2" runat="server" Text="降序排序" OnClick="Button2_Click" />
<asp:Button ID="Button3" runat="server" Text="按好吃分组" OnClick="Button3_Click" />
<asp:Button ID="Button4" runat="server" Text="查找最大值" OnClick="Button4_Click" />
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebApplication1
{
public partial class WebForm4 : System.Web.UI.Page
{
Database1Entities1 db = new Database1Entities1();//创建连接对象
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
//方法语句
var results = db.test313.Select(p => new
{
p.Id,
p.name,
p.price,
p.number,
p.dec
});
//绑定数据对象集合
GridView1.DataSource = results.ToList();
GridView1.DataBind();
}
protected void Button2_Click(object sender, EventArgs e)
{
var results = db.test313.OrderByDescending(p => p.price).ToList();
GridView1.DataSource = results.ToList();
GridView1.DataBind();
}
protected void Button3_Click(object sender, EventArgs e)
{
using (var db = new Database1Entities1()) // 确保使用正确的数据库上下文
{
var r = "好吃的"; // 将 r 改为字符串类型
// GroupBy 语句
var results = db.test313.GroupBy(p => p.dec);
foreach (var group in results)
{
if (group.Key.Trim() == r) // 使用 Trim() 方法去除空格并比较字符串
{
// 使用 LINQ 查询从分组中选择数据
var results2 = group.ToList();
GridView1.DataSource = results2;
GridView1.DataBind();
// 找到一个符合条件的分组后可以跳出循环
break;
}
}
}
}
protected void Button4_Click(object sender, EventArgs e)
{
//查找最大值
var results = from r in db.test313
group r by r.price into g
select new
{
// 查找 price 字段的最大值
key = g.Key,
Count = g.Count(),
MaxPrice = g.Max(p => p.price)
};
var maxPrice = db.test313.Max(t => t.price);
Label1.Text = "最大价格: " + maxPrice.ToString();
}
}
}