Razor 使用WebMatrix构建表
我试图使用WebMatrix（ASP.NET网页）构建一个HTML表，但由于HTML标记的打开和关闭方式，我遇到了问题 我试图实现的是从一个记录集创建一个包含三列的表，然后填充任何空列 这是我用来解决如何使用WebMatrix实现这一点的一些测试代码Razor 使用WebMatrix构建表,razor,webmatrix,Razor,Webmatrix,我试图使用WebMatrix（ASP.NET网页）构建一个HTML表，但由于HTML标记的打开和关闭方式，我遇到了问题 我试图实现的是从一个记录集创建一个包含三列的表，然后填充任何空列 这是我用来解决如何使用WebMatrix实现这一点的一些测试代码 <table> @{ int row = 0; int col = 0; for (int i = 0; i < 20; i++) //20 cells for test purposes { col++; if
<table>
@{
int row = 0;
int col = 0;
for (int i = 0; i < 20; i++) //20 cells for test purposes
{
col++;
if (col == 4)
{
col = 1;
}
if (col == 1)
{
row++;
if (row != 1)
{
</tr>
}
<tr>
}
<td>@i</td>
}
for (int i = col; i <=3; i++)
{
<td>empty</td>
}
</tr>
}
</table>
@{
int行=0；
int col=0；
对于（int i=0；i<20；i++）//20个单元进行测试
{
col++；
如果（列==4）
{
col=1；
}
如果（列==1）
{
行++；
如果（行！=1）
{
}
}
@我
}
对于（int i=col；i根据修订后的要求更新的代码样本：
@{
var db = Database.Open("Northwind");
var data = db.Query("SELECT * FROM Products");
var total = data.Count();
var counter = 1;
var rows = total / 3;
var spares = total % 3 > 0 ? 3 - total % 3 : 0;
if(spares > 0){
rows += 1;
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<table style="border:1px solid black">
@for(var i = 1; i <= rows; i++){
if( counter % 3 == 1){
@:<tr>
}
for(var cell = 1; cell <= 3 && counter <= total; cell++){
<td style="border:1px solid black">
<div>@data.ElementAt(counter-1).ProductId</div>
<div>@data.ElementAt(counter-1).ProductName</div>
<div>@data.ElementAt(counter-1).CategoryId</div>
</td>
counter++;
}
if(counter > total && spares > 0){
for(var j = 1; j <= spares; j++){
<td style="border:1px solid black">
</td>
}
}
if(counter % 3 == 0){
@:</tr>
}
}
</table>
</body>
</html>
@{
var db=数据库.Open（“北风”）；
var data=db.Query（“从产品中选择*）；
var total=data.Count（）；
var计数器=1；
var行=总计/3；
var备件=总计%3>0？3-总计%3:0；
如果（备件>0）{
行+=1；
}
}
@对于（var i=1；i根据修订后的要求更新的代码样本：
@{
var db = Database.Open("Northwind");
var data = db.Query("SELECT * FROM Products");
var total = data.Count();
var counter = 1;
var rows = total / 3;
var spares = total % 3 > 0 ? 3 - total % 3 : 0;
if(spares > 0){
rows += 1;
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<table style="border:1px solid black">
@for(var i = 1; i <= rows; i++){
if( counter % 3 == 1){
@:<tr>
}
for(var cell = 1; cell <= 3 && counter <= total; cell++){
<td style="border:1px solid black">
<div>@data.ElementAt(counter-1).ProductId</div>
<div>@data.ElementAt(counter-1).ProductName</div>
<div>@data.ElementAt(counter-1).CategoryId</div>
</td>
counter++;
}
if(counter > total && spares > 0){
for(var j = 1; j <= spares; j++){
<td style="border:1px solid black">
</td>
}
}
if(counter % 3 == 0){
@:</tr>
}
}
</table>
</body>
</html>
@{
var db=数据库.Open（“北风”）；
var data=db.Query（“从产品中选择*）；
var total=data.Count（）；
var计数器=1；
var行=总计/3；
var备件=总计%3>0？3-总计%3:0；
如果（备件>0）{
行+=1；
}
}
@对于（var i=1；i如何在打印数据集之前对数据集进行分组？它是ASP.NET MVC术语，这称为视图模型。不幸的是，在WebMatrix中，您没有一个控制器可以完成准备此视图模型的工作，但您可以在codebehind或Razor页面的任何部分中执行此操作：
@{
// group the dataset by 3 elements
var data = Enumerable.Range(0, 20).GroupBy(x => x / 3);
}
<table>
@foreach (var group in data)
{
<tr>
@foreach (var item in group)
{
<td>@item</td>
}
@for (int i = 0; i < 3 - group.Count(); i++)
{
<td>empty</td>
}
</tr>
}
</table>
然后：
<table>
@foreach (var group in data)
{
<tr>
@foreach (var element in group)
{
<td>@element.Item.Text</td>
}
@for (int i = 0; i < 3 - group.Count(); i++)
{
<td>empty</td>
}
</tr>
}
</table>
@foreach（数据中的var组）
{
@foreach（组中的var元素）
{
@element.Item.Text
}
@对于（int i=0；i<3-group.Count（）；i++）
{
空的
}
}
可以看出，视图模型的使用避免了在视图中编写难看的意大利面代码
每次您有一些不匹配的标记，并且需要在视图中进行整数和模除法等操作时，您可能会出错，因为您没有选择正确的视图模型。在打印数据集之前对数据集进行分组如何？这是ASP.NET MVC术语，称为视图模型。不幸的是，在WebMatrix中，您没有控制器这可以完成准备此视图模型的工作，但您可以在codebehind或Razor页面的这一部分中进行：
@{
// group the dataset by 3 elements
var data = Enumerable.Range(0, 20).GroupBy(x => x / 3);
}
<table>
@foreach (var group in data)
{
<tr>
@foreach (var item in group)
{
<td>@item</td>
}
@for (int i = 0; i < 3 - group.Count(); i++)
{
<td>empty</td>
}
</tr>
}
</table>
然后：
<table>
@foreach (var group in data)
{
<tr>
@foreach (var element in group)
{
<td>@element.Item.Text</td>
}
@for (int i = 0; i < 3 - group.Count(); i++)
{
<td>empty</td>
}
</tr>
}
</table>
@foreach（数据中的var组）
{
@foreach（组中的var元素）
{
@element.Item.Text
}
@对于（int i=0；i<3-group.Count（）；i++）
{
空的
}
}
可以看出，视图模型的使用避免了在视图中编写难看的意大利面代码
每次您有一些不匹配的标记，并且需要在视图中进行整数和模除法之类的操作时，您可能会犯错误，因为您没有选择正确的视图模型。我不想使用WebGrid。每个单元格将包含一个数据库行，因此很遗憾，您的方法不适合。感谢编辑的响应。That是我一直在寻找的。在开始新的TR之前，我确实需要添加一些额外的行来关闭TR。Darin的答案与我的答案相同，但要好得多。我不想使用WebGrid。每个单元格将包含一个数据库行，因此很遗憾，您的方法将不适合。感谢编辑后的响应。这就是我一直在寻找的或者，在开始新的TR之前，我确实需要添加一些额外的行来关闭TR。Darin的答案与我的答案相同，但要好得多。