Comment utiliser JSF h:selectBooleanCheckbox avec h:dataTable pour obtenir des cases sélectionnées sans soumettre le contenu de la page?

Dans mon application, j'ai un h:datatable qui contient des données des véhicules et h:selectBooleanCheckBox dans chacune de ses lignes. Je veux savoir la case sélectionnée dans la datatable datatable est rangée dans le backing bean sans appliquer n'importe quel bouton soumettre. L'idée de faire de ce qui est; lorsqu'un utilisateur clique sur les cases à cocher dans une page de l'application, il pourrait facilement voir les lignes sélectionnées dans d'autres pages aswell dans la mesure où les datatable dans chaque page contient un grand nombre de véhicules. Par conséquent, les utilisateurs peuvent être en mesure de voir les véhicules sélectionnés dans la page, et faire l'opération relative.

Suivant montre une partie de ma page JSF.

<rich:dataTable id="vehicleTable" var="vhcl" value="#{mainPage.vehicleList}"
binding="#{mainPage.vehicleTable}" > 
<rich:column id="col_sel" width="10px"
<h:selectBooleanCheckbox title="#{general.showOnMap}" onclick="showOnMap(this)"   id="selectedCheckBox" />
</rich:column>
<rich:column id="trackId" label="#{general.vehicleName}" >
<f:facet name="header">
<h:outputText value="#{general.vehicleName}" id="state_name" />
</f:facet>
<h:outputText value="#{vhcl.vehicle.mtsTrackId}" id="vehicleId" title="#{general.vehicleId}" style="font-size:10px; color:blue;" />
<br/>
<h:outputText value="#{vhcl.vehicle.vehiclePlate}" id="vehiclePlate" title="#{general.licencePlate}" style="font-size:10px; color:blue"/>
</rich:column>
<rich:column  id="type_col" label="#{general.vehicleType}" >
<f:facet name="header">
<h:outputText value="#{general.vehichleType}" id="vehichleTypeLabel" />
</f:facet>
<h:graphicImage value="#{vhcl.typeImage}" height="40" width="40" align="left"/>
<h:panelGrid columns="1" align="right">
<h:graphicImage id="statusImage" value="#{vhcl.statusImage}" title="#{vhcl.status}" height="15" width="15" />
<h:graphicImage id="motorStatusImage" value="#{vhcl.motorStatusImage}" title="#{vhcl.motorStatus}" height="15" width="15" />
</h:panelGrid>
</rich:column>
<rich:column id="msg_col" label="#{general.lastMessageDate}" >
<f:facet name="header">
<h:outputText value="#{general.lastMessageDate}" id="lastMsgDateLabel" />
</f:facet>
<h:outputText value="#{vhcl.messageDate}" id="lastMsgDate" /> 
<br />
<h:outputText value="Hız: " />
<h:outputText value="#{vhcl.instantSpeed}" id="lastSpeed" style="color:blue; font-weight:bold" />
<h:outputText value="km/s" />
</rich:column>
<rich:column id="addr_col" label="#{general.address}" >
<f:facet name="header">
<h:outputText value="#{general.address}" id="addressLabel"/>
</f:facet>
<h:outputText value="#{vhcl.address}" id="addr" />
<br />
<h:outputText value="#{vhcl.location}" id="location" style="color:blue;" />
</rich:column>

OriginalL'auteur nudaStck | 2012-11-29

  1. 2

    Dans votre Vehicle classe de créer un Boolean champ et ajouter getter et setter méthodes pour elle comme cela.

    private Boolean selected;
public Boolean getSelected() {
return selected;
}
public void setSelected(Boolean selected) {
this.selected = selected;
}

    Puis lier votre checkBox à la propriété et ajouter un <a4j:support> tag de la checkBox comme ci-dessous.

    <h:selectBooleanCheckbox onclick="showOnMap(this)" value="#{vhcl.selected}">
<a4j:support event="onchange" ajaxSingle="true"/>
</h:selectBooleanCheckbox

    Maintenant, lorsque vous cochez ou décochez la checkBox la valeur est soumis à la fève. Ensuite tout moment, vous pouvez savoir si le vehicle est sélectionné comme ça.

    if(vehicle.selected != null && vehicle.selected) {
//vehicle is selected
}

    Remarque: Votre table doit être à l'intérieur d'une forme.

    Merci beaucoup pour la réponse.
    Merci beaucoup pour la réponse. Il fait mon code beaucoup plus stable. Cependant, elle ne résout pas mon problème. Le point est que j'ai une barre de menu qui contient une page d'accueil et une page de rapport. les deux principaux page et les pages du rapport contient les mêmes véhicules de la table. Lorsqu'un utilisateur, par exemple entre la page principale et en sélectionne un certain nombre de véhicules sur la carte, il pourrait également voir le même vérifié les véhicules dans la page du rapport. Jusqu'à présent, je peux voir tous les véhicules sélectionnés par la soumission du formulaire dans la page d'accueil par un bouton. Est-il possible de mettre les véhicules sélectionnés pour JSF session de l'intérieur du code Javascript w/formulaire de soumission?
    Quelque chose ici n'est pas clair pour moi. Allez-vous garder les deux pages ouvertes dans les différents onglets en même temps? Ou lorsque vous sélectionnez la deuxième page du menu de la deuxième chargement de la page dans l'onglet en cours? Pour la deuxième option, votre bean devrait être de la session de l'étendue et si vous utilisez <a4j:support>s, les sélections de la première page sera reflété dans la deuxième page.
    Lorsque je sélectionne la deuxième page, il est chargé dans le même onglet. Mon bean de session étendue, bien sûr, mais lorsque je sélectionne certains véhicules dans la première page que je dois soumettre le formulaire via un bouton ou un lien. Je ne veux pas mettre un bouton ou quelque chose dans la page. Lorsque je sélectionne les véhicules dans la première page avec <a4j:support> je ne peux pas les voir sur la deuxième page, sans les soumettre à la première page du formulaire. J'ai pensé à quelque chose comme lorsque je sélectionne les véhicules dans la première page, je devrais les garder dans le backing bean via du code Javascript non pas avec un submition bouton puis de les obtenir dans la deuxième page.
    Si votre table est enveloppée avec un form et votre checkBoxes comprennent <a4j:support>s la valeur de la checkBox est soumis lorsque vous avez changé de case à cocher. En fait, je suis incapable de trouver où est le problème. 🙁

    OriginalL'auteur prageeth