JSF 2多重选择列表框示例

最新推荐文章于 2020-07-11 05:56:39 发布

cyan20115

最新推荐文章于 2020-07-11 05:56:39 发布

阅读量231

点赞数

文章标签： xhtml java

在JSF中， <h：selectManyListbox />标记用于呈现多重选择列表框-具有“ multiple ”和“ size ”属性的HTML select元素。

//JSF...
<h:selectManyListbox value="#{user.favFood1}">
   	<f:selectItem itemValue="Fry Checken" itemLabel="Food1 - Fry Checken" />
   	<f:selectItem itemValue="Tomyam Soup" itemLabel="Food1 - Tomyam Soup" />
   	<f:selectItem itemValue="Mixed Rice" itemLabel="Food1 - Mixed Rice" />
</h:selectManyListbox>

//HTML output...
<select name="j_idt6:j_idt8" multiple="multiple" size="3">	
	<option value="Fry Checken">Food1 - Fry Checken</option> 
	<option value="Tomyam Soup">Food1 - Tomyam Soup</option> 
	<option value="Mixed Rice">Food1 - Mixed Rice</option> 
</select>

h：selectManyListbox示例

一个JSF 2.0示例，显示了使用“ h：selectManyListbox ”标记来呈现多个选择列表框，并以3种不同的方式填充数据：

“ f：selectItem ”标签中的硬编码值。
使用Map生成值，并将其放入“ f：selectItems ”标签中。
使用Object数组生成值，并将其放入“ f：selectItems ”标记中，然后使用“ var ”属性表示该值。

1.菜豆

一个后备bean，用于保存和生成多个选择列表框值的数据。用来保存多选列表框值的属性必须是Collection或Array的类型 ；否则，它将遇到以下错误消息

WARNING: Target model Type is no a Collection or Array
javax.faces.FacesException: Target model Type is no a Collection or Array

package com.mkyong;

import java.io.Serializable;
import java.util.Arrays;
import java.util.LinkedHashMap;
import java.util.Map;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
 
@ManagedBean(name="user")
@SessionScoped
public class UserBean implements Serializable{

	public String[] favFood1;
	public String[] favFood2;
	public String[] favFood3;

	//getter and setter methods...

	public String getFavFood1InString() {
		return Arrays.toString(favFood1);
	}
	
	public String getFavFood2InString() {
		return Arrays.toString(favFood2);
	}
	
	public String getFavFood3InString() {
		return Arrays.toString(favFood3);
	}
	
	//Generated by Map
	private static Map<String,Object> food2Value;
	static{
		food2Value = new LinkedHashMap<String,Object>();
		food2Value.put("Food2 - Fry Checken", "Fry Checken"); //label, value
		food2Value.put("Food2 - Tomyam Soup", "Tomyam Soup");
		food2Value.put("Food2 - Mixed Rice", "Mixed Rice");
	}
	
	public Map<String,Object> getFavFood2Value() {
		return food2Value;
	}
	
	//Generated by Object array
	public static class Food{
		public String foodLabel;
		public String foodValue;
		
		public Food(String foodLabel, String foodValue){
			this.foodLabel = foodLabel;
			this.foodValue = foodValue;
		}
		
		public String getFoodLabel(){
			return foodLabel;
		}
		
		public String getFoodValue(){
			return foodValue;
		}
		
	}
	
	public Food[] food3List;
	
	public Food[] getFavFood3Value() {
		
		food3List = new Food[3];
		food3List[0] = new Food("Food3 - Fry Checken", "Fry Checken");
		food3List[1] = new Food("Food3 - Tomyam Soup", "Tomyam Soup");
		food3List[2] = new Food("Food3 - Mixed Rice", "Mixed Rice");
		
		return food3List;
	}
	
}

2. JSF页面

一个JSF页面演示使用“ h：selectManyListbox ”标签。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"   
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      >
    <h:body>
    	
    	<h1>JSF 2 multi-select listbox example</h1>
    	<h:form>
    	
	    1. Hard-coded with "f:selectItem" : 
   		<h:selectManyListbox value="#{user.favFood1}">
   			<f:selectItem itemValue="Fry Checken" itemLabel="Food1 - Fry Checken" />
   			<f:selectItem itemValue="Tomyam Soup" itemLabel="Food1 - Tomyam Soup" />
   			<f:selectItem itemValue="Mixed Rice" itemLabel="Food1 - Mixed Rice" />
   		</h:selectManyListbox>
		
		<br /><br />
	    
	    2. Generated by Map :
   		<h:selectManyListbox value="#{user.favFood2}">
   			<f:selectItems value="#{user.favFood2Value}" />
   		</h:selectManyListbox>
   		
	    <br /><br />
	    
	    3. Generated by Object array and iterate with var :
   		<h:selectManyListbox value="#{user.favFood3}">
   			<f:selectItems value="#{user.favFood3Value}" var="f"
   			itemLabel="#{f.foodLabel}" itemValue="#{f.foodValue}" />
   		</h:selectManyListbox>
   		
	    <br /><br />
	    
    	    <h:commandButton value="Submit" action="result" />
	    <h:commandButton value="Reset" type="reset" />

    	</h:form>
    	
    </h:body>

</html>

result.xhtml…

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"   
      xmlns:h="http://java.sun.com/jsf/html"
      >
 
    <h:body>
    	
    	<h1>JSF 2 multi-select listbox example</h1>
    	
    	<h2>result.xhtml</h2>
    	
    	<ol>
    		<li>user.favFood1 : #{user.favFood1InString}</li>
    		<li>user.favFood2 : #{user.favFood2InString}</li>
    		<li>user.favFood3 : #{user.favFood3InString}</li>
    	</ol>
    </h:body>

</html>

3.演示

单击“提交”按钮时，链接到“ result.xhtml”页面并显示已提交的多选列表框值。

如何预选多个列表框值？

如果与“ h：selectManyListbox ”标签的“ value”匹配，则选择“ f：selectItems ”标签的值。在上面的示例中，如果将favFood1属性设置为“ Fry Checken”和“ Tomyam Soup”：

@ManagedBean(name="user")
@SessionScoped
public class UserBean{

	public String[] favFood1 = {"Fry Checken", "Tomyam Soup"};

	//...

默认情况下，将选择“ favFood1”列表框值，“ Fry Checken”和“ Tomyam Soup”。

下载源代码

下载它– JSF-2-Multi-Select-Listbox-Example.zip （10KB）

参考
JSF <h：selectManyListbox /> JavaDoc
http://www.w3schools.com/tags/att_select_multiple.asp

标签： jsf2 列表框

翻译自: https://mkyong.com/jsf2/jsf-2-multiple-select-listbox-example/

cyan20115

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JSF 2多重选择列表框示例

在JSF中， <h：selectManyListbox />标记用于呈现多重选择列表框-具有“ multiple ”和“ size ”属性的HTML select元素。 //JSF...<h:selectManyListbox value="#{user.favFood1}"> <f:selectItem itemValue="Fry Checken"...
复制链接

扫一扫