PrimeFaces DataTable - besoin d'activer/désactiver des composants basés sur la sélection d'une ligne
Je suis en utilisant un PrimeFaces DataTable pour afficher les enregistrements (généré de façon aléatoire dans un sandbox de l'application). Je suis l'aide de la case à cocher de sélection version. La base DataTable fonctionne parfaitement, y compris les Supprimer et Annuler les boutons (dont la fonctionnalité n'est vraiment est disponible à partir de la boîte de dialogue de confirmation). Je suis en train d'ajouter des fonctionnalités à la DataTable, de sorte que lorsqu'une case est sélectionnée, les autres contrôles de la page sont activés ou désactivés en fonction de la sélection.
En d'autres termes, si aucune ligne n'est sélectionnée (pas de cases sont cochées) certains boutons et/ou des éléments de menu sont désactivées ou non rendu. Sélectionner une ou plusieurs lignes en cliquant sur la case à cocher activer ou de rendre les contrôles. J'ai essayé d'utiliser le construit en JavaScript gestionnaires d'événements, mais je ne peux pas faire ce travail.
Droit maintenant, ma page affiche un DataTable 5 colonnes: une case de sélection de colonne, Nom, prénom, Âge. J'ai fait quelque chose comme ce travail dans un autre carré de sable de mine à l'aide booléenne simple cases à cocher et de la mise à jour d'un booléen avec l'événement onclick. Malheureusement, il ne semble pas être quelque chose de semblable à ce DataTable ou si il ya je ne sais pas comment la mettre en œuvre.
Ma page index:
<?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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.prime.com.tr/ui"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<body>
<ui:composition template="./newTemplate.xhtml">
<ui:define name="content">
<h:form>
<p:dataTable rowSelectListener="#{tableBean.onRowSelect}" var="data" value="#{tableBean.data}" paginator="true" rows="10"
selection="#{tableBean.selectedNames}">
<f:facet name="header">
Customer List
</f:facet>
<p:column selectionMode="multiple" />
<p:column headerText="Cust ID">
<h:outputText value="#{data.id}" />
</p:column>
<p:column headerText="First Name">
<h:outputText value="#{data.firstName}" />
</p:column>
<p:column headerText="Last Name">
<h:outputText value="#{data.lastName}" />
</p:column>
<p:column headerText="Age">
<h:outputText value="#{data.age}" />
</p:column>
<f:facet name="footer">
<p:commandButton update="deleteList" value="Delete" oncomplete="deleteDlg.show()" />
</f:facet>
</p:dataTable>
<p:dialog header="Delete Selected Records" modal="true" widgetVar="deleteDlg"
>
<h:outputText value="You are about to permanently delete records." /><br /><br />
<h:outputText value="Are you sure you want to continue?" /><br /><br/>
<h:commandButton value="CANCEL" action="#{tableBean.cancelDelete()}" /> <h:commandButton value="Delete" action="#{tableBean.deleteNames()}" />
</p:dialog>
</h:form>
</ui:define>
</ui:composition>
</body>
</html>
Code de mon backing bean qui peuvent être pertinents:
public void deleteNames()
{
for(Data person : selectedNames)
{
data.remove(person);
}
}
public void cancelDelete()
{
for(Data name : selectedNames)
selectedNames = null;
}
public void onRowSelect(SelectEvent event)
{
if(selectedNames == null || selectedNames.length < 1)
setDisable(true);
else
setDisable(false);
}
public boolean isDisable() {
if(selectedNames == null || selectedNames.length < 1)
disable = true;
else
disable = false;
return disable;
}
public void setDisable(boolean disable) {
this.disable = disable;
}
OriginalL'auteur Sean | 2010-12-29
Vous devez vous connecter pour publier un commentaire.
Il existe une solution de contournement en effet, pas moins de travail pour moi.
Remplacer "UPDATE_IDS" avec votre panneau ids séparés par des espaces, comme les "panel1 séance 2";
Remplacer " wv1 " avec la valeur de la table de données widgetVar propriété
vous pouvez hi lignes sélectionnées avec un peu plus de la modification
OriginalL'auteur omer.dogan
Était à la recherche de solution au même problème et depuis JSF 2 /Primefaces évoluent très vite ces jours-ci, trouvé plus à la solution de la date de Primefaces de la version 3.0 ou plus.
Conformément à la réponse suivante dans PrimeFaces fil de discussion du forum:
http://forum.primefaces.org/viewtopic.php?f=3&t=1373&sid=bbfcd6a343edf586f927cd7ecd7d01b9&start=10#p48388
on peut ajouter du javascript côté client gestionnaire d'
<p:datatable>
composant en procédant comme suit:1.Ajouter primefaces-extension BOCAL à votre webapp du classpath (cette bibliothèque est également disponible dans le centre de repo Maven sous le même nom). J'ai essayé la version
0.6.3
qui a été plus tard au moment de l'écriture, et il a travaillé pour moi2.Ajouter
pe
de l'espace de noms correspondantxhtml
fichier:3.Ajouter
<pe:javascript>
comme un élément enfant à votre<p:datatable>
composant (peut être ajouté à n'importe quel composant qui implémente ClientBehaviorHolder interface) comme suit:Et qui devrait être, espérons que cette aide...
OriginalL'auteur Yuriy Nakonechnyy
Vous pouvez attraper
ajax
événements qui sont déclenchés lorsque la ligne est sélectionnée.Dans votre cas,
D'autres événements sont déclenchés en fonction du mode de sélection de l'
dataTable
sont:rowSelect
etrowUnselect
rowSelectCheckbox
etrowUnselectCheckbox
rowSelectRadio
toggleSelect
events
OriginalL'auteur unziberla