我们前面说过,最好的学习方法是跟着范例一步一步学习
本章节中我们列出了一些 C# 和 Visual Basic 范例,用于学习 ASP.NET Web Pages
如果你是 ASP.NET 初学者,强烈建议你只学习 C# 的范例,以减轻学习的复杂度
C# 范例
基本的 Web Pages
显示日期和时间
<!DOCTYPE html>
<meta charset="utf-8"/>
<h1>Hello Web Pages</h1>
<p>The time is @DateTime.Now</p>
可重复使用的头部和底部
<html>
<body>
@RenderPage("header.cshtml")
<h1>Hello Web Pages</h1>
<p>This is a paragraph</p>
@RenderPage("footer.cshtml")
</body>
</html>
基本的HTML表单
<!DOCTYPE html>
<meta charset="utf-8" />
@{
if (IsPost) {
string companyname = Request["companyname"];
string contactname = Request["contactname"]; <p>You entered: <br />
Company Name: @companyname <br />
Contact Name: @contactname </p>
}
else
{
<form method="post" action="">
<p>Company Name:</p>
<p><input type="text" name="CompanyName" value="" /></p>
<p>Contact Name:</p>
<p><input type="text" name="ContactName" value="" /></p>
<p><input type="submit" value="Submit" class="submit" /></p>
</form>}}
基本的C#
For循环
<!DOCTYPE html>
<meta charset="utf-8"/>
@for(var i = 10; i < 21; i++)
{
<p>Line @i</p>
}
For Each循环
<!DOCTYPE html>
<meta charset="utf-8"/>
<ul>
@foreach (var x in Request.ServerVariables)
{<li>@x</li>}
</ul>
While 循环
<!DOCTYPE html>
<meta charset="utf-8"/>
@{
var i = 0;
while (i < 5)
{
i += 1;
<p>Line @i</p>
}
}
Array 数组
@{
string[] members = {"Jani", "Hege", "Kai", "Jim"};
int i = Array.IndexOf(members, "Kai")+1;
int len = members.Length;
string x = members[2-1];
}
<!DOCTYPE html>
<meta charset="utf-8"/>
<h3>Members</h3>
@foreach (var person in members)
{
<p>@person</p>
}
<p>The number of names in Members are @len</p>
<p>The person at position 2 is @x</p>
<p>Kai is now in position @i</p>
If 条件
@{var price=50;}
<!DOCTYPE html>
<meta charset="utf-8"/>
@if (price>30)
{
<p>The price is too high.</p>
}
If Else 条件
@{var price=20;}
<!DOCTYPE html>
<meta charset="utf-8"/>
@if (price>30)
{
<p>The price is too high.</p>
}
else
{
<p>The price is OK.</p>
}
Else If 条件
@{var price=25;}
<!DOCTYPE html>
<meta charset="utf-8"/>
if (price>=30)
{
<p>The price is high.</p>
}
else if (price>20 && price<30)
{
<p>The price is OK.</p>
}
else
{
<p>The price is low.</p>
}
Switch 条件
@{
var message="";
var weekday=DateTime.Now.DayOfWeek;
var day=weekday.ToString()
}
<!DOCTYPE html>
<meta charset="utf-8" />
@switch(day)
{
case "Monday":
message="This is the first weekday.";
break;
case "Thursday":
message="Only one day before weekend.";
break;
case "Friday":
message="Tomorrow is weekend!";
break;
default:
message="Today is " + day;
break;
}
<p>@message</p>
使用数据库
显示数据库数据
@{
var db = Database.Open("SmallBakery");
var selectQueryString = "SELECT * FROM Product ORDER BY Name";
}
<!DOCTYPE html>
<meta charset="utf-8" />
<h1>Small Bakery Products</h1>
<table>
<tr>
<th>Id</th>
<th>Product</th>
<th>Description</th>
<th>Price</th>
</tr>@foreach(var row in db.Query(selectQueryString))
{
<tr>
<td>@row.Id</td>
<td>@row.Name</td>
<td>@row.Description</td>
<td align="right">@row.Price</td>
</tr> }
</table>
使用 WebGrid 显示数据
@{
var db = Database.Open("SmallBakery") ;
var selectQueryString = "SELECT * FROM Product ORDER BY Id";
var data = db.Query(selectQueryString);
var grid = new WebGrid(data);
}
<!DOCTYPE html>
<meta charset="utf-8" />
<title>Displaying Data Using the WebGrid Helper</title>
<h1>Small Bakery Products</h1>
<div id="grid">@grid.GetHtml()
使用 Chart 帮助器
根据数组显示条形图
@{
var myChart = new Chart(width: 600, height: 400)
.AddTitle("Employees")
.AddSeries(chartType: "column",
xValue: new[] { "Peter", "Andrew", "Julie", "Mary", "Dave" },
yValues: new[] { "2", "6", "4", "5", "3" })
.Write();
}
根据数据库显示条形图
@{
var db = Database.Open("SmallBakery");
var dbdata = db.Query("SELECT Name, Price FROM Product");
var myChart = new Chart(width: 600, height: 400)
.AddTitle("Product Sales")
.DataBindTable(dataSource: dbdata, xField: "Name")
.Write();
}
根据数据库显示饼图
@{
var db = Database.Open("SmallBakery");
var dbdata = db.Query("SELECT Name, Price FROM Product");
var myChart = new Chart(width: 600, height: 400)
.AddTitle("Product Sales")
.AddSeries(chartType:"Pie",
xValue: dbdata, xField: "Name",
yValues: dbdata, yFields: "Price")
.Write();
}
根据 XML 文件显示饼图
@using System.Data;
@{
var dataSet = new DataSet();
dataSet.ReadXmlSchema(Server.MapPath("data.xsd"));
dataSet.ReadXml(Server.MapPath("data.xml"));
var dataView = new DataView(dataSet.Tables[0]);
var myChart = new Chart(width: 600, height: 400)
.AddTitle("Sales Per Employee")
.AddSeries("Default", chartType: "Pie",xValue: dataView, xField: "Name", yValues: dataView, yFields: "Sales")
.Write();}
}
VB 范例
基本的 Web Pages
显示日期和时间
<!DOCTYPE html>
<meta charset="utf-8"/>
<h1>Hello Web Pages</h1>
<p>The time is @DateTime.Now</p>
可重复使用的头部和底部
<!DOCTYPE html>
<meta charset="utf-8"/>
@RenderPage("header.vbhtml")
<h1>Hello Razor</h1>
<p>This is a paragraph</p>
@RenderPage("footer.vbhtml")
基本的 HTML 表单
<!DOCTYPE html>
<meta charset="utf-8"/>
@if (IsPost)
Dim companyname = Request("CompanyName")
Dim contactname = Request("ContactName")
@<p>You entered: <br><br>
Company Name: @companyname <br>
Contact Name: @contactname </p>
else
@<form method="post" action="">
Company Name:<br>
<input type="text" name="CompanyName" value=""><br>
Contact Name:<br>
<input type="text" name="ContactName" value=""><br><br>
<input type="submit" value="Submit" class="submit">
</form>
end if
基本的 Visual Basic
For 循环
<!DOCTYPE html>
<meta charset="utf-8"/>
@for i=10 to 21
@<p>Line @i</p>
next i
For Each 循环
<!DOCTYPE html>
<meta charset="utf-8"/>
<ul>
@for each x in Request.ServerVariables
@<li>@x</li>
next x
</ul>
While 循环
<!DOCTYPE html>
<meta charset="utf-8"/>
@Code
Dim i=0
Do While i < 5
i += 1
@<p>Line @i</p>
Loop
End Code
Array 数组
@Code
Dim members as String()={"Jani","Hege","Kai","Jim"}
i=Array.IndexOf(members,"Kai")+1
len=members.Length
x=members(2-1)
End Code
<!DOCTYPE html>
<meta charset="utf-8"/>
<h3>Members</h3>
@For Each person In members
@<p>@person</p>
Next person
<p>The number of names in Members are @len</p>
<p>The person at position 2 is @x</p>
<p>Kai is now in position @i</p>
If 条件
@Code
Dim price=50
End Code
<!DOCTYPE html>
<meta charset="utf-8"/>
@If price>30 Then
@<p>The price is too high.</p>
End If
If Else 条件
@Code
Dim price=20
End Code
<!DOCTYPE html>
<meta charset="utf-8"/>
@if price>30 Then
@<p>The price is too high.</p>
Else
@<p>The price is OK.</p>
End If
Else If 条件
@Code
Dim price=25
End Code
<!DOCTYPE html>
<meta charset="utf-8"/>
@if price>=30 Then
@<p>The price is high.</p>
ElseIf price>20 And price<30 then
@<p>The price is OK.</p>
Else
@<p>The price is low.</p>
End If
Switch 条件
@Code
Dim weekday=DateTime.Now.DayOfWeek
Dim day=weekday.ToString()
Dim message=""
End Code
<!DOCTYPE html>
<meta charset="utf-8"/>
@Select Case day
Case "Monday"
message="This is the first weekday."
Case "Thursday"
message="Only one day before weekend."
Case "Friday"
message="Tomorrow is weekend!"
Case Else
message="Today is " & day
End Select
<p>@message</p>
使用数据库
显示数据库数据
@Code
Dim db = Database.Open("SmallBakery")
Dim query = "SELECT * FROM Product"
End Code
<!DOCTYPE html>
<meta charset="utf-8"/>
<h1>Small Bakery Products</h1>
<table border="1" width="100%">
<tr>
<th>Id</th>
<th>Product</th>
<th>Description</th>
<th>Price</th>
</tr>
@Code
Dim row
for each row in db.Query(query)
End Code
<tr>
<td>@row.Id</td>
<td>@row.Name</td>
<td>@row.Description</td>
<td align="right">@row.Price</td>
</tr>
@Code next End Code
</table>
使用 WebGrid 显示数据
@Code
Dim db = Database.Open("SmallBakery")
Dim query = "SELECT * FROM Product"
Dim data = db.Query(query)
Dim grid = new WebGrid(data)
End Code
<!DOCTYPE html>
<meta charset="utf-8"/>
<title>Displaying Data Using the WebGrid Helper</title>
</head>
<body>
<h1>Small Bakery Products</h1>
<div id="grid">
@grid.GetHtml()
</div>
使用 Chart 帮助器
根据数组显示条形图
@Code
Dim myChart as new Chart(600,400)
Dim xarr(4)
xarr(0)="Peter"
xarr(1)="Andrew"
xarr(2)="Julie"
xarr(3)="Mary"
xarr(4)="Dave"
Dim yarr(4)
yarr(0)="2"
yarr(1)="6"
yarr(2)="4"
yarr(3)="5"
yarr(4)="3"
myChart.AddTitle("Employees")
myChart.AddSeries("Employees","column",,,,,xarr,,yarr,,)
myChart.Write()
End Code
根据数据库显示条形图
@Code
Dim db = Database.Open("SmallBakery")
Dim dbdata = db.Query("SELECT Name, Price FROM Product")
Dim myChart = new Chart(600,400)
myChart.AddTitle("Product Sales")
myChart.DataBindTable(dbdata,"Name")
myChart.Write()
End Code
根据数据库显示饼图
@Code
Dim db = Database.Open("SmallBakery")
Dim dbdata = db.Query("SELECT Name, Price FROM Product")
Dim myChart = new Chart(600,400)
myChart.AddTitle("Product Sales")
myChart.AddSeries("Employees","column",,,,,dbdata,"Name",dbdata,"Price")
myChart.Write()
End Code
根据 XML 文件显示饼图
@Imports System.Data
@Code
Dim dataSet = new DataSet()
dataSet.ReadXmlSchema(Server.MapPath("data.xsd"))
dataSet.ReadXml(Server.MapPath("data.xml"))
Dim dataView = new DataView(dataSet.Tables(0))
Dim myChart = new Chart(600,400)
myChart.AddTitle("Sales Per Employee")
myChart.AddSeries("Default","Pie",,,,,dataView,"Name",dataView,"Sales")
myChart.Write()
End Code