2017-11-03 2 views
0

Ich habe eine einfache selectOneMenu Box wie unten aussieht:Wählen Sie mehrere Artikel von Auswahlbox JSF

<h:form> 
    <h3>Combo Box</h3> 
    <h:selectOneMenu value = "#{userData.data}"> 
     <f:selectItem itemValue = "1" itemLabel = "Item 1" /> 
     <f:selectItem itemValue = "2" itemLabel = "Item 2" /> 
     <f:selectItem itemValue = "3" itemLabel = "Item 3" /> 
     <f:selectItem itemValue = "4" itemLabel = "Item 4" /> 
     <f:selectItem itemValue = "5" itemLabel = "Item 5" />  
    </h:selectOneMenu> 
    <h:commandButton value = "+" /> 
    </h:form> 

Was ich möchte mehrere Artikel aus diesem Feld tun, ist die Auswahl, indem Sie auf das + (add) neben die Kiste. Das bedeutet, wenn der Benutzer zuerst das Element in der Box auswählt und dann auf + klickt, möchte ich darunter eine neue Box mit einer weiteren + Schaltfläche anzeigen, so dass der Benutzer weitere Elemente hinzufügen kann, wenn sie möchten, und das ausgewählte Element wird sein Zeigen Sie oben auf der neuen Box mit dem - Zeichen an, damit sie den ausgewählten Artikel entfernen können. Es funktioniert irgendwie wie:

Ist es möglich, diese Art von Box in JSF zu haben? Vielen Dank!

Antwort

1

Ja, das ist genauso möglich, wie sie es bei der Verbindung getan haben.

Wenn Sie ein panelGrid benötigen. Wenn Sie auf die Schaltfläche klicken, ruft die Schaltfläche den Actionlistener auf und das erstellt Ihr neues Auswahlmenü. Denken Sie daran, Ihr Formular oder Panelgrid zu aktualisieren, um es zu sehen (dies kann auch in der verwaltetenBean getan werden).

<h:form id="myform"> 
     <h:panelGrid id="myPanelGrid" columns="1"> 
         <h:selectOneMenu value = "#{userData.data}"> 
          <f:selectItem itemValue = "1" itemLabel = "Item 1" /> 
          <f:selectItem itemValue = "2" itemLabel = "Item 2" /> 
          <f:selectItem itemValue = "3" itemLabel = "Item 3" /> 
          <f:selectItem itemValue = "4" itemLabel = "Item 4" /> 
          <f:selectItem itemValue = "5" itemLabel = "Item 5" />  
         </h:selectOneMenu> 
         <h:commandButton value = "+" actionListener="#{managedBean.addSelectOneMenuToGrid()}"> 
         <f:ajax execute="@form" render=":myForm" /> 
         </h:commandButton> 
     </h:panelGrid> 
<h:panelGrid id="myPanelGridToAdd" columns="1"> 
... 
</h:panelGrid> 
    </h:form> 

und in Ihrer verwalteten Bohne fügen Sie den neuen selectonemenu in Ihr panelGrid programmatisch, nachdem Sie die Taste + geklickt.

public void addSelectOneMenuToGrid() 
    { 
     HtmlPanelGrid component = (HtmlPanelGrid) FacesContext.getCurrentInstance().getViewRoot().findComponent(":myform:myPanelGridToAdd"); 
     SelectOneMenu newMenu = new SelectOneMenu(); 
     newMenu.setRendered(true); 
     UISelectItems items = new UISelectItems(); 

     .... 
     newMenu.getChildren().add(items); 
     ... 
    } 

Es ist nicht einfach zu tun. Aber was Sie brauchen, ist nicht einfach: D

Viel Glück. Wenn Sie weitere Informationen über den Managedbean-Teil benötigen, zögern Sie nicht

+0

warum nicht in xhtml mit einem 'ui: repeat' zu tun? – Kukeltje