Primefaces datatable with selection attribute - dynamic tables - java

First some explain:
I create dynamically an accordeonpanel and in each Tab i create a p:datatable ( also dynamically).
I now have to edit the lines of the tables but my method in the "selection" is not called.
I think it's because of the above explained dynamism.
the method is: evaluationController.deleteIndicator()
Does anyone have an idea how to fix that?
Here the code:
XHTML:
<!-- **************************************** ACCORDEON **************************************** -->
<p:panel id="mainAccordeonHeader" header="Capacités et dégrés de maîtrise" styleClass="panelSearch">
<h:form id="evalAccordionForm" styleClass="orgForm">
<p:accordionPanel id="evalAccordion"
styleClass="orgAccordion"
value="#{evaluationController.availableCapacitys}"
var="capListItem">
<p:tab id="evalAccordTitle">
<f:facet name="title">
<h:panelGrid columns="4">
<h:outputText value="#{capListItem.name}"/>
<h:outputText value="#{capListItem.isThresholdOfSuccess ? 'Capacité Déterminante' : 'Degré de Maitrise'}" />
<h:outputText value="Nr Indicateurs: #{evaluationController.findNumberOfIndicators(capListItem)}"/>
<h:outputText value="Pondération: #{evaluationController.findCapacityPonderation(capListItem)}"/>
</h:panelGrid>
</f:facet>
<!-- CAPACITY DETAIL-->
<table border="0" >
<thead>
<tr>
<th>
<p>Description</p>
</th>
<th>
<p style="float: right">Pondération</p>
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<p:inputTextarea id="capDescTextArea" rows="3" cols="113" value="#{capListItem.description}" readonly="true"/>
</td>
<td>
<p:inputTextarea style="float: right" id="capPonderationTextArea" rows="1" cols="1" readonly="true" value="#{evaluationController.findCapacityPonderation(capListItem)}"/>
</td>
</tr>
</tbody>
</table>
<p:separator />
<!-- INDICATORS-->
<h:form>
<p:contextMenu for="indicatorTable">
<p:menuitem value="Modifier" update="indicatorTable" icon="ui-icon-wrench" actionListener="#{evaluationcontroller.updateIndicator()}"/>
<p:menuitem value="Supprimer" update="indicatorTable" icon="ui-icon-trash" actionListener="#{evaluationController.deleteIndicator()}"/>
<p:menuitem value="Ajouter" update="indicatorTable" icon="ui-icon-plus" actionListener="#{evaluationController.addIndicator()}"/>
<p:separator/>
<p:menuitem value="Annuler action"/>
</p:contextMenu>
<p:dataTable
id="indicatorTable"
value="#{evaluationController.findIndicatorsByCapacity(capListItem)}"
var="indicator"
editable="true"
tableStyle="indicatorTableStyle"
rowKey="#{indicator.id}"
selection="#{evaluationcontroller.selectedIndicatorRow}" selectionMode="single"
>
<f:facet name="header">Les Indicateurs ( #{evaluationController.findNumberOfIndicators(capListItem)})
</f:facet>
<p:column headerText="Org Ut" >
<h:outputText value ="#{indicator.organizedUt.id}"/>
</p:column>
<p:column headerText="Date">
<h:outputText value ="#{indicator.organizedUt.toString()}"/>
</p:column>
<p:column headerText="Nom">
<h:outputText value ="#{indicator.name}"/>
</p:column>
<p:column headerText="Description" toggleable="false" width="450">
<p:outputLabel value ="#{indicator.description}" />
</p:column>
<p:column headerText="Max" toggleable="false" width="30">
<p:inputTextarea style="float: none" rows="1" cols="1" readonly="true" value="#{indicator.maxPossible}"/>
</p:column>
</p:dataTable>
<p:commandButton styleClass="addButtonStyle" icon="ui-icon-plus" value="Ajouter un indicateur"/>
<p:commandButton styleClass="deleteAllButtonStyle" icon="ui-icon-trash" value="Supprimer tous les indicateurs" actionListener="#{evaluationController.deleteIndicator()}"/>
</h:form>
</p:tab>
</p:accordionPanel>
</h:form>
</p:panel>
CONTROLER:
Here is the problem : the Getter Setter are not called when i select a row!
public Indicator getSelectedIndicatorRow() {
System.out.println("GETTER - selectedIndicatorRow");
return selectedIndicatorRow;
}
public void setSelectedIndicatorRow(Indicator selectedIndicatorRow) {
this.selectedIndicatorRow = selectedIndicatorRow;
System.out.println("SETTER - selectedIndicatorRow");
}
public void deleteIndicator(){
System.out.println("Function: deleteIndicator");
try {
System.out.println("TRY TO DELETE INDICATOR");
indicatorFacade.remove(selectedIndicatorRow);
List<Indicator> tempIndicatorsList = actualGridHM.get(selectedIndicatorRow.getCapacity());
actualGridHM.remove(selectedIndicatorRow.getCapacity());
tempIndicatorsList.remove(selectedIndicatorRow);
actualGridHM.put(selectedIndicatorRow.getCapacity(), tempIndicatorsList);
System.out.println("INDICATOR DELETED!");
}
catch (Exception e) {
System.out.println("ERROR - DELETE OF INDICATOR NOT WORKED!");
}
Does anyone have a solution? Maybe an another way to edit this dynamic table ( placed in a dynamic accordeon)??

First obvious problem with your code is that you have two <h:form>. You have to delete the inner <h:form> and test again.

Try this way below;
put your command buttons in facets at the bottom of your datatable like
<p:dataTable>
...
<f:facet>
<p:commandButton styleClass="addButtonStyle" icon="ui-icon-plus" value="Ajouter un indicateur"/>
<p:commandButton styleClass="deleteAllButtonStyle" icon="ui-icon-trash" value="Supprimer tous les indicateurs" action="#{evaluationController.deleteIndicator}"/>
</f:facet>
</p:dataTable>
and use "action" attribute instead of "actionListener" without '()' at the end of your action method in your command button or add ActionEvent parameter to your action method.

Related

Update in datatable after updating data

I'm having a problem updating a column in my datatable after an edit.
I use a dialog to edit the data you want. You are saving everything in the database, the problem
Rezide in updating the table, the fields are being updated with the new values,
Only one that is not updating, just a selectOneMenu that is in the dialog.
The field that is not updating is from the Lotação, the rest is working.
My table..
<h:head>
</h:head>
<h:body>
<ui:composition template="/WEB-INF/template/template.xhtml">
<ui:define name="TituloCorpo">Alterar Impressora</ui:define>
<ui:define name="Corpo">
<div align="center">
<h:form id="form">
<!-- BOTÕES QUE GERA RELATÓRIOS EM PDF E CSV -->
<div style="width:2958px">
<h:commandLink>
<h:graphicImage value="/resources/img/icon_pdf.png" width="35" title="Relatório em PDF"/>
<p:dataExporter type="pdf" target="tab" fileName="impressoras" pageOnly="true"/>
</h:commandLink>
<h:commandLink>
<h:graphicImage value="/resources/img/icon_csv.png" width="35" title="Relatório em CSV"/>
<p:dataExporter type="csv" target="tab" fileName="impressoras" pageOnly="true" />
</h:commandLink>
</div>
<!-- SCRIPT QUE CRIA UMA TABELA -->
<p:dataTable id="tab" var="impressora" widgetVar="tab" value="#{impressoraMB.impressoras}" editable="true" reflow="true" style="width:1100px">
<p:column id="fabricante" headerText="Fabricante" filterBy="#{impressora.fabricante}" filterMatchMode="contains" style="width:170px">
<h:outputLabel value="#{impressora.fabricante}"/>
</p:column>
<p:column id="modelo" headerText="Modelo" filterBy="#{impressora.modelo}" filterMatchMode="contains" style="width:170px">
<h:outputLabel value="#{impressora.modelo}"/>
</p:column>
<p:column id="modeloCartucho" headerText="Modelo do Cartucho" filterBy="#{impressora.modeloCartucho}" filterMatchMode="contains" style="width:180px">
<h:outputLabel value="#{impressora.modeloCartucho}"/>
</p:column>
<p:column id="patrimonio" headerText="Patrimonio" filterBy="#{impressora.patrimonio}" filterMatchMode="contains" style="width:120px">
<h:outputLabel value="#{impressora.patrimonio}"/>
</p:column>
<p:column id="lotacao" headerText="Lotação" filterBy="#{impressora.nome}" filterMatchMode="contains" style="width:110px">
<h:outputLabel value="#{impressora.nome}"/>
</p:column>
<p:column headerText="Alterar" style="width:70px" exportable="false">
<p:commandButton update=":formAlterar:panelAlterar" icon="ui-icon-pencil" title="Alterar" style="height:35px;width:35px"
oncomplete="PF('alterarImpre').show()" ajax="true">
<f:setPropertyActionListener value="#{impressora}" target="#{impressoraMB.impressora}"/>
</p:commandButton>
</p:column>
<p:column headerText="Remover" style="width:90px" exportable="false">
<p:commandButton update=":formExcluir:panelExcluir" oncomplete="PF('excluirImpre').show()" icon="ui-icon-trash"
styleClass="btn btn-small" style="height:35px;width:35px" title="Excluir">
<f:setPropertyActionListener value="#{impressora}" target="#{impressoraMB.impressora}"/>
</p:commandButton>
</p:column>
</p:dataTable>
</h:form>
</div>
<!-- PAGINA COM A CAIXA DE DIALOGO -->
<ui:include src="/panel.xhtml"/>
</ui:define>
</ui:composition>
</h:body>
My dialog..
<p:dialog id="editar" header="Altere os dados desejados" widgetVar="alterarImpre" width="600" location="center"
draggable="true" modal="true" responcive="true" showEffect="fade" hideEffect="fade">
<h:form id="formAlterar">
<h6 align="center"><i>*Para abrir o campo de edição, clique em cima do valor</i></h6>
<br/>
<h:panelGrid id="panelAlterar" columns="2" cellpadding="5" width="75%">
<h:outputLabel for="fabricante" value="Fabricante:"/>
<p:inplace id="fabricante" editor="true" emptyLabel="Me edite">
<p:inputText value="#{impressoraMB.impressora.fabricante}" required="true" label="text"/>
</p:inplace>
<h:outputLabel for="modelo" value="Modelo:"/>
<p:inplace id="modelo" editor="true" emptyLabel="Me edite">
<p:inputText value="#{impressoraMB.impressora.modelo}" required="true" label="text"/>
</p:inplace>
<h:outputLabel for="modeloCartucho" value="Modelo do Cartucho: "/>
<p:inplace id="modeloCartucho" editor="true" emptyLabel="Me edite">
<h:inputText value="#{impressoraMB.impressora.modeloCartucho}" required="true" label="text"/>
</p:inplace>
<h:outputLabel for="patrimonio" value="Patrimonio"/>
<p:inplace id="patrimonio" editor="true" emptyLabel="Me edite">
<p:inputText value="#{impressoraMB.impressora.patrimonio}" required="true" label="text"/>
</p:inplace>
<h:outputLabel for="lotacoes" value="Lotações:"/>
<h:panelGroup>
<h:selectOneMenu id="lotacoes" value="#{impressoraMB.impressora.id_Lotacoes}" effect="fold" required="true"
immediate="true" style="width:100%">
<f:selectItems value="#{lotacoesMB.listLotacoes}" var="item"
itemLabel="#{item.nome}" itemValue="#{item.id}"/>
<f:ajax execute="#this"/>
</h:selectOneMenu>
</h:panelGroup>
</h:panelGrid>
<br/>
<div align="center">
<h:panelGrid>
<h:panelGroup>
<p:commandButton id="btnAlterar" value="Alterar" action="#{impressoraMB.alterar}" onclick="PF('alterarImpre').hide()"
oncomplete="PF('form').hide(); #{impressoraMB.impressora}" ajax="true" process="#form" title="Alterar">
<f:ajax execute="#all" render=":form:tab"/>
</p:commandButton>
<p:commandButton id="btnCancelar" value="Cancelar" onclick="PF('alterarImpre').hide()" title="Cancelar"/>
</h:panelGroup>
</h:panelGrid>
</div>
</h:form>
</p:dialog>
MY Bean..
public class ImpressoraMB {
private Impressora impressora;
private ImpressoraDAO dao;
private List<Impressora> impressoras;
public ImpressoraMB() {
impressora = new Impressora();
impressoras = new ArrayList<Impressora>();
dao = new ImpressoraDAO();
}
public List<Impressora> getImpressoras() {
if (impressoras.size() == 0) {
impressoras = dao.getImpressoras();
}
return impressoras;
}
public void adicionar() {
dao.adicionar(impressora);
impressora = new Impressora();
}
public void remover() {
dao.remover(impressora);
impressoras.remove(impressora);
impressora = new Impressora();
}
public void alterar() {
dao.alterar(impressora);
impressora = new Impressora();
}
public void showMsgAdicionar() {
FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, "Impressora adicionada", "com sucesso!");
RequestContext.getCurrentInstance().showMessageInDialog(message);
}
public Impressora getImpressora() {
return impressora;
}
public void setImpressora(Impressora impressora) {
this.impressora = impressora;
}
}
Thank you very much in advance.
In your dialog you have
<h:selectOneMenu id="lotacoes" value="#{impressoraMB.impressora.id_Lotacoes}" effect="fold"
required="true" immediate="true" style="width:100%">
while your DataTable uses
<p:column id="lotacao" headerText="Lotação" filterBy="#{impressora.nome}"
filterMatchMode="contains" style="width:110px">
<h:outputLabel value="#{impressora.nome}"/>
</p:column>
If you change the value in one of the two different .xhtml files you should have the expected result
You have to use the update attribute in your command button or in your ajax call.
<p:commandButton id="btnAlterar" value="Alterar" action="#{impressoraMB.alterar}" update=":form:tab" onclick="PF('alterarImpre').hide()"
oncomplete="PF('form').hide(); #{impressoraMB.impressora}" ajax="true" process="#form" title="Alterar">
or
<f:ajax execute="#all" update=":form:tab" render=":form:tab"/>
Make sure that the object is updated in the backed bean

Parameter values concatenated into dynamic columns in Primefaces?

I'm generating is so dynamic columns in a datatable in JSF with Primefaces 4. It turns out that the only way to generate it through two lists where one has data grid and other attributes of the bean.
So far it has happened only handle this.
<p:dataTable id="listCust" var="cust" value="#{mantClienteMB.customers}" rows="5"
rowIndexVar="rowIndex" paginatorPosition="top" resizableColumns="true" emptyMessage="">
<p:column headerText="N°" width="auto">
<h:outputText value="#{rowIndex+1}" />
</p:column>
<c:forEach items="#{mantClienteMB.columnCustomer}" var="colum">
<p:column headerText="#{colum.descripcion}" width="auto">
<ui:fragment rendered="#{colum.entidadBean == 'code'}">
<h:outputText value="#{cust.code}" />
</ui:fragment>
<ui:fragment rendered="#{colum.entidadBean == 'name'}">
<h:outputText value="#{cust.name}" />
</ui:fragment>
<ui:fragment rendered="#{colum.entidadBean == 'comercialName'}">
<h:outputText value="#{cust.comercialName}" />
</ui:fragment>
<ui:fragment rendered="#{colum.entidadBean == 'isActive'}">
<h:outputText value="#{cust.isActive}" />
</ui:fragment>
</p:column>
</c:forEach>
</p:dataTable>
In code java:
private List<BaCustomer> customers;
private List<ValidColumnKey> columnCustomer;
this.setCustomers(new ArrayList<BaCustomer>());
this.getCustomers().add(new BaCustomer("P0001", "PASSARELA S.A.C.", "PASSARELA", true));
this.getCustomers().add(new BaCustomer("P0002", "DARNOX S.A.C.", "DONOFRIO", true));
this.setColumnCustomer(new ArrayList<ValidColumnKey>());
this.getColumnCustomer().add(new ValidColumnKey(1, "Codigo", "code"));
this.getColumnCustomer().add(new ValidColumnKey(2, "Nombre", "name"));
this.getColumnCustomer().add(new ValidColumnKey(3, "Nombre Comercial", "comercialName"));
this.getColumnCustomer().add(new ValidColumnKey(4, "Estado", "isActive"));
But it occurred to me that if I could concatenate the value of the alias in the main list with the names of the attributes bean I get from the second list should work, but the problem of contenacion is that only prints the string, but not the result chain.
<p:dataTable id="listCust" var="cust" value="#{mantClienteMB.customers}" rows="5"
rowIndexVar="rowIndex" paginatorPosition="top" resizableColumns="true" emptyMessage="">
<p:column headerText="N°" width="auto">
<h:outputText value="#{rowIndex+1}" />
</p:column>
<c:forEach items="#{mantClienteMB.columnCustomer}" var="colum">
<p:column headerText="#{colum.descripcion}" width="auto">
<ui:param name="myVar" value="cust.#{colum.entidadBean}" />
<h:outputText value="#{myVar}" />
</p:column>
</c:forEach>
</p:dataTable>
Anyone have an idea how to print the string value and not just the string as description.
Image:
http://s2.subirimagenes.com/otros/previo/thump_8745153listcustomers.jpg
Just use bracket-writing
#{cust[colum.entidadBean]}
Hope it helps...

Why i can't refresh my dataTable, after adding data?

When i drag my panel into my 'dataTable', all works fine(my listener is called, my object is added to my DataBase) but my 'dataTable' is not updated and i need to refresh my page to see it. My xhtml:
<h:form id="formDashboard">
<p:layoutUnit id="gridLeft" position="west" size="250" style="position:absolute;">
<p:fieldset style="padding:0;padding-top:5px;">
<f:facet name="legend" id="legendId">
<p:commandButton icon="ui-icon-plus" actionListener="#{myMemosController.prepareCreate}" value="Add Memo" onclick="addMemo.show()" update=":formAdd:commentAddInput, :formAdd:chooseAddPriority" style="width:30px;height:30px;"/>
</f:facet>
<p:dataGrid id="leftData" var="item" columns="1" value="#{myMemosController.items}" style="border:none;">
<p:panel id="pnl" style="background-color:#{item.priority}}" closable="true">
<p:ajax event="close" listener="#{myMemosController.destroy}"/>
<f:facet name="header">
<h:panelGroup>
<h:outputText value="#{item.name}" styleClass=""/>
<p:commandButton icon="ui-icon-pencil" actionListener="#{myMemosController.prepareEdit}" update=":formEdit:commentEditInput, :formEdit:chooseEditPriority" onclick="editMemo.show();" style="width:19px;height:19px;"/>
</h:panelGroup>
</f:facet>
<h:panelGrid columns="1" style="width:100%">
<h:outputText value="#{item.comments}" styleClass=""/>
</h:panelGrid>
<f:facet name="footer">
<h:outputText value="#{item.date} at #{item.time}" styleClass="footerStyle"/>
</f:facet>
</p:panel>
<p:draggable for="pnl" helper="clone" handle=".ui-panel-titlebar" stack=".ui-panel" zindex="100"/>
</p:dataGrid>
</p:fieldset>
</p:layoutUnit>
<p:layoutUnit position="center" style="position:absolute;">
<p:fieldset id="selectedMemos" legend="Selected Memos" style="margin-top:20px">
<p:outputPanel id="dropArea">
<p:dataTable id="centerData" value="#{dashboardController.items}" var="item">
<p:column style="text-align:center;">
<f:facet name="header">
<h:outputText value="Priority"/>
</f:facet>
<h:outputText value="#{item.priorityname}"/>
</p:column>
<p:column style="text-align:center;">
<f:facet name="header">
<h:outputText value="Name"/>
</f:facet>
<h:outputText value="#{item.name}"/>
</p:column>
<p:column style="text-align:center;">
<f:facet name="header">
<h:outputText value="Comment"/>
</f:facet>
<h:outputText value="#{item.comments}"/>
</p:column>
<p:column style="text-align:center;">
<f:facet name="header">
<h:outputText value="Time"/>
</f:facet>
<h:outputText value="#{item.time}"/>
</p:column>
<p:column style="text-align:center;">
<f:facet name="header">
<h:outputText value="Date"/>
</f:facet>
<h:outputText value="#{item.date}"/>
</p:column>
</p:dataTable>
</p:outputPanel>
</p:fieldset>
<p:droppable for="selectedMemos" tolerance="touch" activeStyleClass="ui-state-highlight" >
<p:ajax listener="#{myMemosController.onMemoDrop}" process="#this" update="dropArea, leftData"/>
</p:droppable>
</p:layoutUnit>
</h:form>
My method onMemoDrop:
public void onMemoDrop(DragDropEvent ddEvent)
{
String[] idTokens = ddEvent.getDragId().split(String.valueOf(UINamingContainer.getSeparatorChar(FacesContext.getCurrentInstance())));
int rowIndex = Integer.parseInt(idTokens[idTokens.length - 2]);
String name = idTokens[idTokens.length - 3];
MyMemos memo = null;
if (name.equals("leftData"))
{
items.setRowIndex(rowIndex);
memo = (MyMemos) items.getRowData();
dashboardController.create(1, memo.getName(), memo.getComments(), memo.getDate(), memo.getTime(), memo.getPriority(), memo.getPriorityname());
}
}
and the create method:
public String create(int id, String name, String comment, String date, String time, String priority, String priorityName)
{
try
{
System.out.println("I am in Create() method from DashboardController");
current = new Dashboard(id, name, comment, date, time, priority, priorityName);
getFacade().create(current);
JsfUtil.addSuccessMessage(ResourceBundle.getBundle("/resources/Bundle").getString("DashboardCreated"));
return prepareCreate();
} catch (Exception e) {
JsfUtil.addErrorMessage(e, ResourceBundle.getBundle("/resources/Bundle").getString("PersistenceErrorOccured"));
return null;
}
}
May be a suggestion?
I think that this code is not working :
<p:ajax listener="#{myMemosController.onMemoDrop}" process="#this" update="dropArea, leftData"/>
, because this p:ajax cannot resolve the 'dropArea'. Ultimately, the component cannot be found and is not getting updated.
One solution to point to you datatable is set update as :
update=":#{p:component('centerData')}, :#{p:component('leftData')}"
Or maybe use widget vars
The problem was from my managed bean "DashboardController", when i removed #stateless and added an injection like: #ManagedBean(name = "dashboardController") and in MyMemosController i added: #ManagedProperty("value="#{dashboardController}""). Now my dataTable is correctly update.

Forward variable on the next page

I have a Users table. Added, view and delete work. But I have problem to edit.
My list page:
<h:form id="form">
<p:dataTable styleClass="table" value="#{userMB.allAdmins}" var="admin" paginator="true" rows="15" rowKey="#{admin.id}" selection="#{userMB.user}" selectionMode="single">
<f:facet name="header">
Lista administratorów
</f:facet>
<p:column headerText="#{msg.firstName}">
<h:outputText value="#{admin.firstName}" />
</p:column>
<p:column headerText="#{msg.lastName}">
<h:outputText value="#{admin.lastName}" />
</p:column>
<p:column headerText="#{msg.personalId}">
<h:outputText value="#{admin.personalId}" />
</p:column>
<f:facet name="footer">
<p:commandButton id="viewButton" value="#{msg.info}" icon="ui-icon-search"
update=":form:display" oncomplete="userDialog.show()"/>
<p:commandButton action="#{userMB.createStart()}" value="#{msg.add}" icon="ui-icon-plus" />
<p:commandButton action="#{userMB.editStart()}" value="#{msg.edit}" >
<f:setPropertyActionListener target="#{userMB.user}" value="#{userMB.user}" />
</p:commandButton>
<p:commandButton action="#{userMB.deleteUser()}" value="#{msg.delete}" icon="ui-icon-close"/>
</f:facet>
</p:dataTable>
<p:dialog id="dialog" header="Administrator" widgetVar="userDialog" resizable="false"
width="300" showEffect="clip" hideEffect="explode">
<h:panelGrid id="display" columns="2" cellpadding="4">
<f:facet name="header">
<p:graphicImage value="./../../images/person4.png" width="150" height="150"/>
</f:facet>
<h:outputText value="#{msg.firstName}" />
<h:outputText value="#{userMB.user.firstName}" />
<h:outputText value="#{msg.lastName}" />
<h:outputText value="#{userMB.user.lastName}" />
<h:outputText value="#{msg.personalId}" />
<h:outputText value="#{userMB.user.personalId}" />
</h:panelGrid>
</p:dialog>
</h:form>
I want to send the selected user on the next page:
I use aciontListener:
<p:commandButton action="#{userMB.editStart()}" value="#{msg.edit}" >
<f:setPropertyActionListener target="#{userMB.user}" value="#{userMB.user}" />
</p:commandButton>
My edit page where I want to send user:
<h:form>
<div id="userPanel">
<h:inputHidden value="#{userMB.user}" />
<p:panel id="panelUser" header="Edytuj administratora" >
<div id="panelImage">
<img src="./../../images/person4.png" alt="person" width="150px" height="130px"/>
</div>
<h:panelGrid columns="3">
<p:outputLabel for="firstName" value="#{msg.firstName}"></p:outputLabel>
<p:inputText id="firstName" value="#{userMB.user.firstName}" label="#{msg.firstName}" required="true">
<f:validator validatorId="nameValidator" />
<p:ajax update="msgFristName" event="keyup" />
</p:inputText>
<p:message for="firstName" id="msgFristName"/>
<p:outputLabel for="lastName" value="#{msg.lastName}"></p:outputLabel>
<p:inputText id="lastName" value="#{userMB.user.lastName}" label="#{msg.lastName}" required="true">
<f:validator validatorId="nameValidator" />
<p:ajax update="msgLastName" event="keyup" />
</p:inputText>
<p:message for="lastName" id="msgLastName"/>
<p:outputLabel for="personalId" value="#{msg.personalId}"></p:outputLabel>
<p:inputText id="personalId" value="#{userMB.user.personalId}" label="#{msg.personalId}" required="true">
<f:validator validatorId="personalIdValidator" />
<p:ajax update="msgPersonalId" event="keyup" />
</p:inputText>
<p:message for="personalId" id="msgPersonalId"/>
<p:outputLabel for="password" value="#{msg.password}"></p:outputLabel>
</p:panel>
</div>
</h:form>
I added: <h:inputHidden value="#{userMB.user}" /> but I do not see data user, only empty field. How do I send this person? I used once this method in other project, a little different without primefaces and it worked. Why now does not work?
Method editStart:
public String editStart() {
return "editStart";
}
faces-config:
<navigation-case>
<from-outcome>editStart</from-outcome>
<to-view-id>/protected/admin/adminEdit.xhtml</to-view-id>
<redirect/>
</navigation-case>
When I'm on the side adminEdit I edited the pool and do editUser method:
public String editUser() {
FacesContext context = FacesContext.getCurrentInstance();
Map requestParameterMap = (Map) context.getExternalContext().getRequestParameterMap();
try {
String userRole = requestParameterMap.get("userRole").toString();
String active = requestParameterMap.get("active").toString();
Boolean act = Boolean.parseBoolean(active);
user.setRole(userRole);
user.setActive(act);
userDao.update(user);
} catch (EJBException e) {
sendErrorMessageToUser("Edit error");
return null;
}
sendInfoMessageToUser("Account edited");
return user.getRole() + "List";
}
My method editStart use only for navigation.
You can either consider Przemek's answer or use one of the 4 ways of passing a parameter to a backing bean.
1. Method expression
2. f:param
3. f:atribute
4. f:setPropertyActionListener
For very well explained full explanation refer to this
It has easy to understand examples. Take a look and pick what fits your needs.
Or simply:
In the actual managed bean...
public String navigationButtonListener(User parameter) {
FacesContext.getCurrentInstance().getExternalContext().getRequestMap()
.put("parameterAttribute", parameter);
return "my-destination-page";
}
In the destination managed bean...
#PostConstruct
public void init(){
myAttribute= (User) FacesContext.getCurrentInstance()
.getExternalContext().getRequestMap().get("parameterAttribute");
}
Good Luck!
You can pass your userid through the session.
Add a parameter to your commandLink
<p:commandButton action="#{userMB.editStart()}" value="#{msg.edit}>
<f:param name="userId" value="#{userMB.user.id}" />
</p:commandButton>
In your backing bean do this
FacesContext context = FacesContext.getCurrentInstance();
HttpServletRequest myRequest = (HttpServletRequest)context.getExternalContext().getRequest();
HttpSession mySession = myRequest.getSession();
Integer userId = Integer.parseInt(myRequest.getParameter("userId"));
After that you can reload the user you want to edit with the Id you got

How to navigate in JSF page?

I want to create h:datatable with list of data:
<h:dataTable id="dataTable" value="#{SessionsController.dataList}" binding="#{table}" var="item">
<!-- Check box -->
<h:column>
<f:facet name="header">
<h:outputText value="Select" />
</f:facet>
<h:selectBooleanCheckbox onclick="highlight(this)"
value="#{item.selected}" />
</h:column>
<h:column>
<f:facet name="header">
<h:commandLink value="№"
actionListener="#{SessionsController.sort}">
<f:attribute name="№" value="№" />
</h:commandLink>
</f:facet>
<h:outputText
value="#{table.rowIndex + SessionsController.firstRow + 1}" />
</h:column>
<h:column>
<f:facet name="header">
<h:commandLink value="Account Session ID"
actionListener="#{SessionsController.sort}">
<f:attribute name="sortField" value="Account Session ID" />
</h:commandLink>
</f:facet>
<h:outputText value="#{item.aSessionID}" />
</h:column>
<h:column>
<f:facet name="header">
<h:commandLink value="User ID"
actionListener="#{SessionsController.sort}">
<f:attribute name="sortField" value="User ID" />
</h:commandLink>
</f:facet>
<h:outputText value="#{item.userID}" />
</h:column>
<h:column>
<f:facet name="header">
<h:commandLink value="Activity Start Time"
actionListener="#{SessionsController.sort}">
<f:attribute name="sortField" value="Activity Start Time" />
</h:commandLink>
</f:facet>
<h:outputText value="#{item.activityStart}" />
</h:column>
<h:column>
<f:facet name="header">
<h:commandLink value="Activity End Time"
actionListener="#{SessionsController.sort}">
<f:attribute name="sortField" value="Activity End Time" />
</h:commandLink>
</f:facet>
<h:outputText value="#{item.activityEnd}" />
</h:column>
<h:column>
<f:facet name="header">
<h:commandLink value="Activity"
actionListener="#{SessionsController.sort}">
<f:attribute name="sortField" value="Activity" />
</h:commandLink>
</f:facet>
<h:outputText value="#{item.activity}" />
</h:column>
</h:dataTable>
I want when I click on a table row to open a new page which displays more details. I want to use the table key aSessionID which will be used for SQL query to get a data from the database. I know that I can use h:commandLink to pass the key but I don't want ugly html link. Is there other way to click on the JSF table row, pass a key and open a new window?
Best Wishes
EDIT
I found one possible solution here
Using this JavaScript code it's possible to open a new window when the user clicks on a row:
<table id="row_link">
<tbody>
<tr>
<td>link</td>
<td>info 1</td>
</tr>
<tr>
<td>link</td>
<td>info 2</td>
</tr>
</tbody>
</table>
$("table#row_link tbody tr").click(function () {
window.location = $(this).find("a:first").attr("href");
});
The question is how I can pass this key aSessionID to the new window.
In the above example href is used to pass the link to the new window. What attribute can be used in JSF table?
#BalusC (JSF expert) has a post about managing Datatable in JSF 1.2 but it works for JSF 2.x too. You're interested in the select row on click section.
UPDATE:
Let me explain the example. First, every JSF component ID will have this form: :, example:
<h:form id="myForm">
<h:inputText id="myInputText" value="#{myBean.textValue}" />
</h:form>
This will generate the HTML:
<form id="myForm">
<input type="text" id="myForm:myInputText" />
</form>
Second, you have to update the generated DOM for the datatable. He's doing that by javascript and also gives you the js code:
function addOnclickToDatatableRows() {
//gets all the generated rows in the html table
var trs = document.getElementById('form:dataTable').getElementsByTagName('tbody')[0]
.getElementsByTagName('tr');
//on every row, add onclick function (this is what you're looking for)
for (var i = 0; i < trs.length; i++) {
trs[i].onclick = new Function("highlightAndSelectRow(this)");
}
}
Third, define the highlightAndSelectRow js function (you can change the name to whatever you want).
function highlightAndSelectRow(tr) {
//get all the datatable rows
var trs = document.getElementById('form:dataTable').getElementsByTagName('tbody')[0]
.getElementsByTagName('tr');
//find the selected rowby using the tr parameter
for (var i = 0; i < trs.length; i++) {
if (trs[i] == tr) {
//once found it, change the color (maybe you don't need this part)
trs[i].bgColor = '#ff0000';
//update a hidden value in the form (maybe you need this code)
document.form.rowIndex.value = trs[i].rowIndex;
//here, you can add js code to open a new window
//or simulate a button/link click or something else you need.
} else {
trs[i].bgColor = '#ffffff';
}
}
}
UPDATE 2:
I've made a test for this case. I'll show you the code to get it done using facelets.
DataTable.xhtml
<script type="text/javascript">
function addOnclickToDatatableRows() {
//gets all the generated rows in the html table
var trs = document.getElementById('myForm:dataTable').getElementsByTagName('tbody')[0]
.getElementsByTagName('tr');
//on every row, add onclick function (this is what you're looking for)
for (var i = 0; trs.length > i; i++) {
trs[i].onclick = new Function("rowOnclick(this)");
}
}
function rowOnclick(tr) {
var elements = tr.cells[0].childNodes;
for(var i = 0; elements.length > i; i++) {
//get the link
if ((typeof elements[i].id !== "undefined") &&
(elements[i].id.indexOf("lnkHidden") > -1)) {
//open a new window/tab using the href generated in link
window.open(elements[i].href);
break;
}
}
return false;
}
</script>
<h:form id="myForm">
<h1>Show data</h1>
<h:dataTable id="dataTable" var="data" value="#{datatableBean.lstData}">
<h:column>
<f:facet name="header">
<h:outputText value="ID" />
</f:facet>
<h:outputText value="#{data.id}" />
<!-- define a hidden link for every row of the datatable
the value attribute contains the page to redirect. -->
<h:outputLink id="lnkHidden" value="AnotherPage.xhtml"
style="display:none">
<f:param name="id" value="#{data.id}" />
</h:outputLink>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Value" />
</f:facet>
<h:outputText value="#{data.value}" />
</h:column>
</h:dataTable>
</h:form>
DataTableBean class
#ManagedBean
#ViewScoped
public class DatatableBean {
private List<Data> lstData;
/**
* Creates a new instance of datatableBean
*/
public DatatableBean() {
lstData = new ArrayList<Data>();
lstData.add(new Data(1, "Hello World"));
lstData.add(new Data(2, "Hello StackOverflow"));
lstData.add(new Data(3, "Hello Luiggi"));
System.out.println("LOL");
}
//define getters and setters...
}
AnotherPage.xhtml
<h1>This is another page</h1>
<h:panelGrid columns="2">
<h:outputText value="Selected ID" />
<h:outputText value="#{anotherPageBean.id}" />
</h:panelGrid>
AnotherPageBean class
#ManagedBean
#RequestScoped
public class AnotherPageBean {
private int id;
/**
* Creates a new instance of AnotherPageBean
*/
public AnotherPageBean() {
try {
this.id = Integer.parseInt((String)FacesContext
.getCurrentInstance().getExternalContext()
.getRequestParameterMap().get("id"));
//by getting the id you can get more data
}
catch (Exception e) {
this.id = 0;
}
}

Categories

Resources