NoahWeb
在线搜索
NoahWeb.net | 开发者交流中心 | 支持 | 文档 | 反馈缺陷 

多值提取类型控件(choice)示例

当你希望用户从提供的选项里选择出所需要的内容时候使用checkbox类型控件可以满足,但是,如果用户可选值非常多的话,该控件不是个好选择,而且不够形象。下面的时间中,我们一起来看一看NoahWeb中的“多值提取”(choice)类型控件是如何帮你解决类似问题的。我们依旧是先来看一看代码。如下图

第一行的InputLine我们在先前的介绍中已经了解,在此不再做介绍。注意代码段第二行的Type,使用了"choice",是的,这就是本文的主题-“多值提取”类型。如下图

使用该类型后,前端页面显示如下图


如图,我们看到两个类似于TextArea的选择框,左边提供了用户可选值,而右边则是用来显示用户已选择的值,稍候我们会逐一详细介绍。
继续来看,下面一行的Label标签我们也已经有所了解,用来该Input控件的显示名称。而下面一行的LabelB比较重要,该标签是choice类型特有的标签,用来控制已选择区域的显示名称。如下图

该标签的使用需要你注意,当你的控件类型为“choice”时才可以使用它,其他类型控件不能使用,切记。
choice类型控件中共有四个按钮用来操作用户可选值的提取与归还,如下图

图中只有两个,按钮A和按钮C,是的,那么另外两个为什么没有显示呢?我们一起来看一看下面两句代码相信你会明白的。如下图

我们来看一看HiddenChoiceButtonB标签,其实,从字面上我们就可以知道,它的作用是设定该choice控件是否隐藏ButtonB,我们将choice类型控件中提供的按钮使用从上到下的排列方式,依次是A,B,C,D,而现在我们通过使用该标签将按钮B和按钮D隐藏,另外,该标签的默认值为假。如果我们将这两组标签删除,那么前端页面显示如下图

我们看到,按钮B和按钮D都已经显示出来了,下面,我们来看一看这四个按钮的功能。首先,按钮A用来将选中的值提取到“已选择”框中。如下图

按钮B用来将所有可选值一并提取到“已选择”框中。如下图



按钮C用来将选中的已选值归还到“选择”框中。如下图

按钮D用来将所有已选值一并归还到“选择”框中。如下图

我们看到,每当你提取或是归还一个值的时候,该值被直接移动,而不是使用一个“拷贝”到目标框中,这种模式称之为“选中移出模式”,在choice类型控件中,我们可以使用SelectNotRemove标签来取消该模式。如下图



回到前端页面,我们再来操作一次,直接点击按钮B,如下图

有点像“复制”和“剪切”的道理,使用该标签后,当我们再次点击按钮B的时候,“选择”框中的值将一个“拷贝”“复制”到了“已选择”框中。从而取消了“选中移出”模式。如果你的应用中需要类似的操作,请使用该标签。另外,使用choice类型控件时,系统默使用“选中移出”模式。

继续看下面,size标签用来设置前端页面中“选择”框和“已选择”框的大小。
如下图

我们将size的值改变,来看一看前端页面的显示效果,如下图

可以清楚的看到,两个框的大小发生了变化。

继续,下面的ChoiceTableCss标签用来设定该choice控件Choice区域的外区域控制表格样式。如下图

下面的Values标签先前我们在“多值选择类型”控件中的“select类型控件”部分已经做了详细介绍,在此不再赘述。
除了上述所有标签之外,choice类型控件的标签还有一些:

ChoiceButtonAText-设定该choice控件ButtonA上显示的文本
ChoiceButtonBText-设定该choice控件ButtonB上显示的文本
ChoiceButtonCText-设定该choice控件ButtonC上显示的文本
ChoiceButtonDText-设定该choice控件ButtonD上显示的文本

上述标签的作用是一样的,仅仅是对应的按钮不同,我们一起来做一个操作。如下图

我们在代码中插入ChoiceButtonAText标签,那么前端页面显示如下图

是的,你可以使用这些标签对四个按钮的显示文本进行设置。如果没有使用该标签,那么系统默认使用"<" "<<" ">" ">>"作为按钮显示文本。

另外,ChoiceNullText标签用来设定该choice控件当没有选中或没有可选内容时候的文本,默认为"无"。我们一起来操作一下。如下图


我们在代码中插入了ChoiceNullText标签,来看一看前端页面的显示,如下图

choice类型控件使用“选择”框和“已选择”框的选择方式,较之传统的select(下拉单),checkbox(多选按钮)方式,更加生动,更加形象。用户所选择的值被提取到了“已选择”框中,当页面提交的时候,choice选中的所有内容提交到服务器后为一个数组。可以根据需要进行相应处理。例如:

<Foreach ArrayName="_root.others" SetVar="abc" Sort="">

<SetVar Name="titledesc" Value="[abc]" />

<Echo? ContentLinkId="viewtitle" />

</Foreach>

 

 

 

 

查看NoahWeb在线手册

Copyright © 2001-2004 The NoahWeb Corporation
All rights reserved.