生成表格

腾讯的WeUI样式库并不包括表格,为方便普通用户,Foxtable对此进行了扩展。

一个例子

我们先用一个简单的例子,看看如何增加表格,HttpRequest事件代码:

Select Case e.Path
    Case "table.htm"
       
Dim wb As New WeUI
        With wb.AddTable("","Table1")
            .head.AddRow("
部门","姓名","年龄","电话","地址") '表头
            .body.AddRow("
技术部","张三","36","110","中国北京") '数据
            .body.AddRow("
技术部","李四","38","110","中国上海")
            .body.AddRow("
技术部","王五","39","110","中国深圳")
            .body.AddRow("
生产部","赵六","39","110","中国深圳")
            .body.AddRow("
生产部","刘七","39","110","中国深圳")
        End With
        e.WriteString(wb.Build)

End
Select

下图是通过手机访问的效果:

AddTable

增加表格的语法是:

AddTable(ParentID, ID)

ParentID 父容器的ID,如果是顶层对象,设置为""即可
ID 表ID

AddRow

表格有三个对象,分别为Head(表头)、Body(表体)、Foot(表尾),这三个对象都有AddRow方法,用于增加行。
AddRow方法的参数就是新增行各列的值。
AddRow还可以直接用数组或集合作为参数,非常方便:


Dim
vals() As String = {"生产部","刘七","39","110","中国深圳"}
.body.AddRow(vals)

Class和Attribute

表有Class和Attribute属性。
行只有Attribute属性,可通过Attribute属性设置其Class。

例如将HttpRequet事件代码设置为:

Select Case e.Path
    Case "table.htm"
       
Dim wb As New WeUI
        wb.AppendHTML("<style>.mark{background-color:red; color:white;}</style>", True) '
添加样式
        With wb.AddTable("","Table1")
            .Attribute= "border='2'"
            .head.AddRow("
部门","姓名","年龄","电话","地址")
            .body.AddRow("
技术部","张三","36","110","中国北京")
            .body.AddRow("
技术部","李四","38","110","中国上海")
            .body.AddRow("
技术部","王五","39","110","中国深圳").Attribute = "class='mark'"
            .body.AddRow("
生产部","赵六","39","110","中国深圳")
            .body.AddRow("
生产部","刘七","39","110","中国深圳")
        End With
        e.WriteString(wb.Build)

End
Select

下图是通过手机访问的效果,表的边框加厚了,第三行变成了红底白字:


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