使用InputCell
我们之前定义的各种输入框，其实都是放在输入格中的，每个输入格被分成两部分，左边显示标签，右边显示输入框。
通过InputCell，我们可以对格子进行更多的控制。
一个例子
我们先用一个例子说明如何使用InputCell。
在运行这个例子之前，先下载下面的图片到"d:\web\images"目录中，名称为"vcode.jpg"：
HttpRequest事件代码：
Select
Case e.Path
Case "test.htm"
Dim wb
As New
weui
wb.AddForm("","form1","test.htm")
With wb.AddInputGroup("form1","ipg1","基本资料")
.AddInput("xm","姓名","text")
'常规语法增加输入框
With .AddInputCell("ic1")
'通过InputCell增加输入框
.AddLabel("lnl","年龄",0)
'增加标签,0显示在左边
.AddInput("nl","number",1)
'增加输入框,1表示显示在中间
End With
With .AddInputCell("ic2",1)
'通过InputCell增加输入框,1表示突出显示
.AddLabel("lkh","卡号",0)
'增加标签,0显示在左边
.AddInput("kh","number",1).PlaceHolder=
"请输入卡号"
'增加输入框,1表示显示在中间
End With
With .AddInputCell("ic3",2)
'通过InputCell增加输入框,
2表示突出显示(含图标)
.AddLabel("lmm","密码",0)
'增加标签,0显示在左边
.AddInput("mm","text",1).PlaceHolder=
"请输入密码"
'增加输入框,1表示显示在中间
End With
With .AddInputCell("ic4")
'通过InputCell增加输入框
.AddLabel("lsj","手机",0)
'增加标签,0显示在左边
.AddInput("sj","text",1)
'增加输入框,1表示显示在中间
.AddVcodeButton("hym","获取验证码",2)
'增加获取验证码按钮,2表示显示在右边
End
With
With .AddInputCell("ic5")
'通过InputCell增加输入框
.AddLabel("lyzm","验证码",0)
'增加标签,0显示在左边
.AddInput("yzm","text",1)
'增加输入框,1表示显示在中间
.AddImage("pim",".\images\vcode.jpg",2)
'增加一个图片,2比表示显示在右边
End
With
With .AddInputCell("ic6")
'通过InputCell增加输入框
.AddSelect("zn","+86|+87|+88|+89",0)
'增加下拉列表,0表示显示在左边
.AddInput("dh","text",1).PlaceHolder
= "请输入联系电话"
'增加输入框,1表示显示在中间
End
With
End With
e.WriteString(wb.Build)
'生成网页
End
Select
下图是是通过手机访问的显示效果：
上面的例子基本涵盖了InputCell的全部用法。
增加InputCell的语法很简单：
AddInputCell(ID)
AddInputCell(ID，Warn)
| ID | InputCell的ID |
| Warn | 可选参数，设为1左边标签会套红显示，设为2右边还会显示一个红色警示图标。 |
AddLabel
InputCell中通过AddLabel方法增加标签，语法为：
AddLabel(ID, Text, Position)
| ID | 标签ID |
| Text | 标签内容 |
| Position | 标签位置，0靠左显示，1居中显示，2靠右显示 |
AddInput
InputCell通过AddInput方法增加输入框，语法：
AddInput(ID, Type, Position)
| ID | 输入框ID | ||||||||||||
| Type | 输入框类型，可选值有：
|
||||||||||||
| Position | 输入框位置，0靠左显示，1居中显示，2靠右显示 |
AddSelect
InputCell通过AddSelect方法增加列表输入框，语法：
AddSelect(ID, Values, Position)
| ID | 列表输入框ID。 |
| Values | 列表项目，用符号"|"隔开，例如"大专|本科|硕士|博士"。 |
| Position | 标签位置，0靠左显示，1居中显示，2靠右显示 |
AddVcodeButton
InputCell通过AddVcodeButton方法增加类似"获取验证码"的按钮，语法：
AddVcodeButton(ID, Text, Position)
| ID | 按钮ID |
| Text | 按钮标题。 |
| Position | 按钮位置，0靠左显示，1居中显示，2靠右显示 |
AddImage
InputCell通过AddImage方法增加图片，语法：
AddImage(ID, File, Postion)
| ID | 图片ID |
| File | 图片文件，包括路径。 |
| Position | 图片位置，0靠左显示，1居中显示，2靠右显示 |