ASP.NET移动开发之SelectionList控件 |
||||||||||||||||||||||||||||||||||||||||||||||||
正如前面提及的那样,SelectionList控件适用于呈现较短列表的数据项。尽管它不具备对长列表的分页显示功能,但是它的呈现形式是丰富多样的。只要设备浏览器支持,SelectionList控件可以以下拉列表、单项按钮、多选按钮和复选框等众多形式存在。 SelectionList控件的列表中只有一个可视的数据项,其它的数据项只能以隐藏值的形式与可视的数据项进行关联。要在服务器控件语法中指定隐藏值,可以在<Item>元素中使用Value属性,并且将Value属性指定某数据项即可。如果使用动态绑定的形式来构建列表的话,那么你可以使用DataValueField属性指定数据源中的某个字段作为隐藏值。 语法 SelectionList列表控件的语法如下面的清单所示:
至于要显示的列表数据项我们可以从数据源中进行读取,这种情况下我们需要使用DataMember、 DataSource、DataTextField和DataValueField等属性。当然你也可以使用<item>标签静态地定义要显示的数据项和隐藏值。注意,在上述SelectionList列表控件的语法中,并没有包含SelectedIndex这个属性,这是因为我们不可以在服务器控件语法中使用它,只有通过代码才可以使用SelectedIndex属性来获取当前选项的索引值。如果在服务器控件语法中要使某数据项处于被选中的状态,你可以在与该数据项对应的<Item> 标签中设置Selected属性为True。 属性和事件 下表描述列举了SelectionList列表控件中的一些常用的属性和事件,其中"类型"列描述了对应属性的类型,这样你就可以在代码中对这些属性进行设置和读取,至于这些属性可用的值你可以参考"语法"小节中的说明。
SelectedIndex和Selection这两个属性只有当某个数据项被选择后才可以在代码中进行设置。你可以在代码中读取SelectedIndex的属性值,以确定当前选中的数据项在列表中对应的索引值。Selection也是类似的,只不过它返回的是与当前选中的数据项对应的MobileListItem对象,而不是索引值。 当用户在一个Selection列表中做出相应的选择后,客户端浏览器上的Form窗体将那些被选择的一个或多个数据项进行相应的编码,并将这些编码信息添加到要回发到服务器的数据中,这样ASP.NET运行时就可以利用这些被回发到服务器的数据来更新Selection的一些属性,例如SelectedIndex。但是Selection并不会因为用户选择好了数据项后就自动地将数据信息回发到服务器上,而是要借助一个Command控件产生回发操作,为此你需要将这个Selection列表控件和Command控件放置在同一个Form控件中。 Selection列表控件的类型 Selection列表控件允许用户只能做出单项的选择,当然这需要你将Selection列表控件的SelectType属性设置为DropDown、ListBox或Radio。如果你将Selection列表控件的SelectType属性设置为MultiSelectListBox 或CheckBox的话,用户将可以同时选择列表中的多个选项。在代码中,你可以使用SelectionList类中的SelectType方法来设置或获取列表控件所要使用的类型。如果Selection列表控件采用的是多项选择模式的话,那么IsMultiSelect属性将返回一个true值。 注意,在WML 1.2或者以前的WML版本中,是无法支持单项框、下拉列表等图形用户界面元素的。在这些只上述的WML设备上,Selection列表控件是以一个WML<select>元素进行呈现的,<select>元素也支持单项和多项的方式。在WML浏览器上,你可以使用软键(softkey)定位到一个数据项上进行选择,也可以使用一个数字键选择一个数据项,很显然,使用数字键的方式更便捷也更直观。因此,如果你想采用数字键来选择列表中的数据项的话,那么你必须确保该列表的项数应该小于或等于9个。下图是Selection列表控件的不同类型在不同浏览器上的显示效果:
构建一个静态列表 在静态列表中,数据项是使用Text属性指定一个字符串来进行呈现的,而不是动态地读取自数据源中的某个字段内容。要指定一个静态列表的数据项,你必须使用<Item>属性,具体的示例代码如下: <Item Text="Text" Value="Value" Selected="{True|False}" /> Text属性用来指定在列表中显示的数据项信息,而Value就是相关联的隐藏值。如果你希望某数据项在默认情况下就处于被选中的状态的话,那么你可以将Selected属性设置为True。 注意,每个Selection列表控件都与一个MobileListItemCollection对象关联。当你使用服务器控件语法静态地定义数据项,实际上是将与每个数据项对应的MobileListItem对象添加到MobileListItemCollection对象中。你可以在代码中使用Items属性来访问MobileListItemCollection集合。你还可以使用MobileListItemCollection类中的Add、Clear和Remove等方法来添加、清除或删除数据项。这些方法的具体用法你可以参考相应的MSND帮助文档,这里就不再详细介绍了。 识别Selection列表控件中被选中的数据项(单项模式) 在Selection列表控件的单选模式下,你可以使用Selection.Name属性来获取被选中数据项的显示文本,还可以使用Selection.Value属性获取被选中数据项的对应的隐藏值。下面的两个程序清单就是一个显示被选中数据项对应隐藏值的示例代码: Default.aspx:
程序代码说明:在这个程序中,我们在该页面上创建了两个窗体,Form1上放置了一个SelectionList列表控件,默认的类型为下拉列表,所以你只可以选择一项。当然,你还可以显式地设置SelectType属性为"DropDown"。在代码中可以看到,我们使用<Item>元素静态地定义各个数据项,其中用Text属性设置列表控件要显式的字符信息,而Value属性就是与显示的字符信息相关联的隐藏值(本例中为手机的制造商和机型)。由于你选择一个数据项后,SelectionList列表控件无法自动将改变后的信息自动回发到服务器上,所以还在Form1上再放置了一个Command控件,用来产生一个回发。也就是说当用户选择好了列表中的某项后,在点击提交按钮就可以将相应的信息回发到服务器端进行处理了,我们在本例中设置了该Command控件OnClick事件的处理函数为HandleSingleSelection,该事件处理函数的具体内容你可以查看对应的代码后置文件。Form2的功能就是显示那个数据项被用户选中,当你点击提交按钮后,Form2窗体将作为活动窗体,显示信息。 Default.aspx.cs
程序代码说明:HandleSingleSelection就是Command控件的OnClick事件的处理函数。一旦用户点击了该Command按钮,将使Form2成为活动窗体。并在Label3控件上将选中的数据项的字符信息和隐藏值显示出来。 如果你不在移动Web.Config文件中设置如下的代码,则在Openwave浏览器中会出错:
为此你最好将如下的移动Web.Config配置代码替代Visual Studio自动生成的移动Web.Config配置代码: Web.Config
下面的是Pocket IE和Openwave浏览器在运行该程序时的截图:
识别Selection列表控件中被选中的数据项(多项模式) 在Selection列表控件的多选模式下,你必须检测列表中的每个数据项,以便确定那些数据项处于选中的状态。前文提及过,我们可以使用Selection列表控件的Items属性来访问MobileListItemCollection对象。在该集合中,那些处于选中状态的MobileListItem对象,其Selected属性的属性值将为true。下面的程序清单就是用来指出列表中那些数据项处于选中的状态: Default.aspx:
程序代码说明:由于我们要在这个列表控件中实现多选,为此将Selection列表控件的SelectType设置为MultiSelectListBox。而后在Form2控件中添加一个TextView控件,使得所有被选中的数据项的字符信息和隐藏值信息都可以显示出来。
下面的对应的截图:
绑定数据源 下面这个示例将创建一个简单的ArrayList集合,作为Selection列表控件的数据源。在代码后置文件中,我们创建了一个Mobile类,用来存取每个数据项。在Page_Load事件处理函数中,我们将创建好的Mobile对象添加到一个ArrayList集合中。而后,将Selection列表控件与该ArrayList集合绑定。最后通过一个foreach 语句迭代整个列表,并将各个数据项中的信息以一个字符串的形式显示在页面上。 Default.aspx
|