<f: SelectItems> JSF personalizado etiqueta de atributo sobre herramientas

Question

¿Es posible añadir un atributo "title" a la etiqueta en JSF, por ejemplo:

<f:selectItems value="#{foo.fooList}" title="{foo.fooDescription}"/> 

HTML generado:

<select> 
    <option value="foo1" title="description1">foo ex1</option> 
    <option value="foo2" title="description2">foo ex2</option> 
</select> 

Answer 1

No tengo una solución elegante, pero se puede hacer. Estoy asumiendo JSF 2+ & Facelets VDL.

Para un bean gestionado Foo:

@ManagedBean @RequestScoped 
public class Foo { 
    private List<SelectItem> fooList = Arrays.asList(
      new SelectItem("value1", "label1", "description1"), 
      new SelectItem("value2", "label2", "description2")); 

    public List<SelectItem> getFooList() { 
    return fooList; 
    } 
} 

Se puede utilizar JavaScript para establecer el atributo title en el nodo DOM:

<h:selectOneMenu binding="#{requestScope.fooSelectOne}"> 
    <f:selectItems value="#{foo.fooList}" /> 
</h:selectOneMenu> 
<script> 
(function() { 
    var selectName = '#{requestScope.fooSelectOne.clientId}'; 
    var kids = document.getElementsByName(selectName)[0] 
        .getElementsByTagName("option"); 
    var index = 0; 
    <ui:repeat value="#{foo.fooList}" var="_opt"> 
    kids[index++].title = '#{_opt.description}'; //TODO: escape this 
    </ui:repeat> 
}()); 
</script> 

Answer 2

Creo que para la etiqueta f:selectItems no existe ningún atributo (title) disponible. Tiene este atributo en la etiqueta simple option en HTML pero no en jsf. Creo que deberías usar la etiqueta simple select en lugar de selectOneMenu para obtener el valor title.

Answer 3

Suponga que su <h:selectOneMenu es como sigue.

<h:form id="myForm"> 
    <h:selectOneMenu id="myCombo"> 
    <f:selectItems value="#{foo.fooList}"/> 
    </h:selectOneMenu> 
</h:form> 

Ahora en window.onload Se puede recorrer option s y añadir la title como a continuación

<script> 
    window.onload = function() { 
     var options = document.getElementById("myForm:myCombo").options; 
     for(var i = 0; i &lt; options.length; i++) { 
      options[i].title = "description" + i; 
     } 
    } 
</script> 

Answer 4

atributo ITEMDESCRIPTION no aparecerá en la costura 2.2.

La mejor solución sería usar javascript para mostrar información sobre herramientas para cada elemento seleccionado.

<script type="text\javascript"> 
 
    function getTooltip(id){ 
 
    var options = document.getElementById(id).options; 
 
     for(var i = 0; i &lt; options.length; i++) { 
 
      options[i].title = "description" + i; 
 
     } 
 
    } 
 
</script>

si su ID se genera de forma dinámica o de otra manera, por ejemplo.

<rich:dataTable value="#{mybean.list}"> 
    <h:selectOneMenu value="#{mybean.selectedValue}" onmouseover=getTooltip(this.id)> 
    <f:selectitems value="#{mybean.selectlist}"> 
    </h:selectOneMenu> 
</rich:datatable> 

Esta solución funciona para todos de identificador generado dinámicamente, así como fácil

Answer 5

Para generar un atributo title en su generada options, puede simplemente usar pasarela atributos como esto:

<f:selectItems value="#{values}" p:title="Your title here"/>