List函数

当用户访问list.htm时，服务器会将访问请求转给自定义函数list处理。

list函数用于分页显示数据，这里假定使用的是SQL Server数据源，其代码为：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61

Dim e As RequestEventArgs = args(0)
'订单删除代码
If e.GetValues.ContainsKey("deloid") Then '如果提交了deloid参数,则删除对应的订单.
    DataTables("订单").SQLDeleteFor("订单编号='" & e.GetValues("deloid") & "'")
    DataTables("订单明细").SQLDeleteFor("订单编号='" & e.GetValues("deloid") & "'")
End If
'获取要显示的页
Dim page As Integer = 0 '默认page为0,显示第一页
Dim pageRows As Integer = 10 '每页10行
If e.GetValues.ContainsKey("page") Then '如果地址中有page参数
    Integer.TryParse(e.GetValues("page"), page) '提取page参数
End If
Dim StartRow As Integer = page * pageRows + 1 '此页第一行
Dim EndRow As Integer = (page + 1) * pageRows '此页最后一行
'获取该页数据
Dim cmd As New SQLCommand
cmd.ConnectionName = "orders" '记得设置数据源名称
cmd.CommandText = "Select Count(*) From {订单}"
Dim Count As Integer = cmd.ExecuteScalar() '获取总的行数
Dim Pages As Integer = Math.Ceiling(Count/PageRows) '计算出总页数
cmd.CommandText = "Select * From (Select Row_Number() Over(Order by 订单.订单编号 desc ) As RowNum,订单.订单编号,日期,客户,Sum(数量) As 数量,sum(数量*单价) As 金额"
cmd.CommandText = cmd.CommandText & " From 订单 Left JOIN 订单明细 ON 订单明细.订单编号 = 订单.订单编号 Group By {订单}.订单编号,日期,客户) As a "
cmd.CommandText = cmd.CommandText & " Where RowNum >= " & StartRow & " And RowNum <= " & EndRow
Dim dt As DataTable = cmd.ExecuteReader
'根据此页数据生成表格
Dim wb As New WeUI
With wb.AddTable("","Table1")
    .PageNumber = page '设置页码
    .ActiveSheet = "menu" '指定菜单
    .Primarykey = "订单编号" '指定主键,只要是能唯一区分行的列即可,并非一定要表的实际主键.
    .CreateFromDataTable(dt, False,"","","订单编号","客户","日期","数量","金额")
End With
'设计菜单
With wb.AddActionSheet("","menu")
    .Add("mnudAdd", "增加订单").Attribute="onclick='addnew()'" '调用js函数
    .Add("mnuEdit", "编辑订单").Attribute ="onclick='edit()'"
    .Add("mnuDelete", "删除订单").Attribute ="onclick=""show('dlg1')"""
    .Add("mnuFirst","第一页","List.htm?page=0",True)
    .Add("mnuLast","最末页","List.htm?page=" & pages - 1)
    .Add("mnuCancel","取消","",True)
End With
With wb.AddDialog("","dlg1", "删除确认","您确定要删除当前订单吗?")
    .AddButton("btnCancel","取消").Kind = 1
    .AddButton("btnOK","确定").Attribute = "onclick='del()'"
End With
'生成换页按钮
With wb.AddButtonGroup("","btg1", False)
    .Add("btnAdd", "增加订单").Attribute = "onclick='addnew()'"
    If page > 0 Then
        .Add("btnPrev", "上一页","","List.htm?page=" & page - 1)
    Else
        .Add("btnPrev", "上一页").Kind = 1
    End If
    If Endrow < count Then
        .Add("btnNext", "下一页","","List.htm?page=" & page + 1)
    Else
        .Add("btnNext", "下一页").Kind = 1
    End If
End With
wb.AppendHTML("<script src='./lib/order.js'></script>") '引入脚本文件
e.WriteString(wb.Build)

代码解析

list.htm一般带有一个page参数，例如：
list.htm?page=2
表示要显示第3页数据。

如果要删除订单，还需要带有deloid参数，例如：
list.htm?page=2&deloid=161130078
表示要删除编号为161130078的订单，然后显示第3页数据。

第3行代码判断GetValues是否由deloid参数。
如果有，则在第4行代码删除对应的订单，在第5行代码删除对应的订单明细。

第8行代码定义了一个变量page，这个变量表示要显示的页面，默认为0.，也就是显示第1页。
第10行到第12行代码，判断GetValues集合是否包括page参数，如果有的话，将其转换为整数保存在变量page中。

第13行和第14行代码，分别计算出此页第一行数据的顺序号，和最后一行数据的顺序号。
第19行代码统计出订单表的总行数，第20行代码据此算出总页数。

第21行到第24行代码，利用SQL语句提取出这一页数据，保存在DataTable型变量dt中。
需要注意几点：
1、顺序号根据订单编号降序生成，保证新增订单显示在第一页。
2、后台的订单表其实没有数量和金额两列，所以要在select语句中用聚合函数计算出每个订单的数量和金额。
3、订单和订单明细表用的是Left Join方式联结，确保没有录入订单明细的订单，也能出现在查询结果中。

第27行到第32行代码根据这页数据生成表格。
第28行代码设置了表的页码。
第29行代码设置了表格的上拉菜单名称。
第30行代码指定了主键列名称，这个名称不一定是订单表真正的主键，只要是能唯一区分每个订单的列即可。

第34行到第41行生成了上拉菜单，菜单名称必须和第29行代码使用的名称保持一致。
第42行到第45行代码生成了一个对话框，用于删除订单。
第47到第59行代码生成了操作按钮。
除了上一页和下一页命令，其他命令都是调用js函数。
这些js函数定义在“d:\web\lib\order.js”文件中，我们之前已经对此进行了介绍。
第60行代码引用了这个js函数文件。

综上所述，list.htm默认只显示三个常用的按钮，分别是增加订单、上一页和下一页：

连续点击某个单元格，可以显示一个上拉菜单，通过这个菜单可以进行跟多的操作，例如编辑或删除当前订单：

现在我们结合具体代码，分别看看list.htm是如何实现新增订单、编辑订单和删除订单的：

删除订单

当我们在菜单中点击"删除订单"时，会显示一个对话框（第37行代码）：

如果在对话框中单击确定按钮，会执行js函数del(第44行代码)。
　

del函数的代码为：

function del(){
location="list.htm?page=" + table1.pagenumber + "&deloid=" + table1.primarykey;
}

假定我们正在访问第3页，选定订单的订单编号为161130078，此时table1.pagenumber等于2，table1.primarykey等于161130078，以上代码合成的链接为：

list.htm?page=2&deloid=161130078

服务器收到这个访问请求之后，触发HttpRequest事件，转给List函数负责处理，List函数执行第3行到第6行代码，删除编号为161130078的订单及其订单明细。

编辑订单

当我们在菜单中点击"编辑订单“时，会执行js函数edit，这个函数的代码为：

function edit(){
location="edit.htm?page=" + table1.pagenumber + "&oid=" + table1.primarykey;
}

假定我们正在访问第3页，选定订单的订单编号为161130078，此时table1.pagenumber等于2，table1.primarykey等于161130078，以上代码合成的链接为：

edit.htm?page=2&oid=161130078

服务器收到这个访问请求之后，触发HttpRequest事件，转给Edit函数负责处理，Edit函数是如何处理以上访问请求的，在介绍Edit函数的时候会详细讲述。

增加订单

当我们单击"增加订单"按钮时，会调用js函数addnew，这个函数的代码为：

function addnew(){
location="edit.htm?page=" + table1.pagenumber;
}
　

假定我们正在访问第3页，此时table1.pagenumber等于2，以上代码合成的链接为：

edit.htm?page=2

服务器收到这个访问请求之后，触发HttpRequest事件，转给Edit函数负责处理，Edit函数是如何处理以上访问请求的，在介绍Edit函数的时候会详细讲述。

本页地址：http://www.foxtable.com/mobilehelp/topics/0128.htm