JSF - Pagination implementation using Tomahawk - jsf

I am trying to implement Pagination in JSF using Tomahawk. When the page is loaded, the table in the first page is populated with data. But, when I click on Next or Prev the table is empty. I don't see any javascript error in the browser. Following is the code from the jsp. Please let me know if I am missing something:
<t:dataTable id="tableid" value="#{SiteSearchCriteria.siteList}"
var="item" border="1" rows="5" rowIndexVar="rowIndex"
rowClasses="trobg1,trobg2">
<h:column>
<f:facet name="header">
<h:outputText value="siteName"></h:outputText>
</f:facet>
<h:outputLabel value="#{item.siteName}"></h:outputLabel>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="siteCLLI"></h:outputText>
</f:facet>
<h:outputLabel value="#{item.siteCLLI}"></h:outputLabel>
</h:column>
</t:dataTable>
<t:dataScroller id="dataScrollerId" for="tableid" fastStep="10"
pageIndexVar="pageIndex" renderFacetsIfSinglePage="true"
pageCountVar="pageCount" paginator="true" paginatorMaxPages="9"
immediate="true">
<f:facet name="first">
<t:outputText value="First"></t:outputText>
</f:facet>
<f:facet name="last">
<t:outputText value="Last"></t:outputText>
</f:facet>
<f:facet name="previous">
<t:outputText value="Previous"></t:outputText>
</f:facet>
<f:facet name="next">
<t:outputText value="Next"></t:outputText>
</f:facet>
</t:dataScroller>

The backing bean that I was using was in "request" scope. Hence, the data was not visible when I clicked on "Next". Changed the scope of backing bean to "Session" and things started to work.

Related

Implementing colorpicker in jsf

I am using richfaces but it lacks colorpicker componenet. I found colorpicker in standbox
release of richfaces but I am unable to use it. How do I use it? Are there any other alternative colorpicker component?
<rich:dataTable id="addeditdtable"
value="#{Lecontroller.LeType.LeList}" var="Le" >
<rich:column>
<f:facet name="header">
<h:outputText value="Upper Range"/>
</f:facet>
<h:inputText value="#{Le.upperrange}"/>
</rich:column>
<rich:column>
<f:facet name="header">
<h:outputText value="Color"/>
</f:facet>
<h:inputText class="makemecolorpicker" value="#{Le.color}"/>
</rich:column>
<rich:column>
<f:facet name="header">
<h:outputText value="ADD/Delete"/>
</f:facet>
<a4j:commandLink value="Add"
actionListener="#{Lecontroller.addLeDTO()}"
render="Leform:addeditdtable"/>
<h:outputText value=" / "/>
<a4j:commandLink value="Delete"
actionListener="#{Lecontroller.removeLeDTO(Le)}"
render="Leform:addeditdtable"/>
</rich:column>
</rich:dataTable>
This is rich datatable or jsf datatable with dynamic row addition. One of the column represents colorpicker where I should be able to pick a colour and save it.

Richfaces: component rich:dataScroller doesn't work

i'm using richfaces 3.3.3 I've a rich:dataTable inside another rich:dataTable and both have a rich:dataScroller but the inner doesn't work:
<rich:dataTable id="dataTableVisibility" value="#{jsfGridUtenti.itemKeys}"
var="roleName" cellspacing="1"
cellpadding="1" border="1"
styleClass="tab" style="width:60%"
rowClasses="rdispari,rpari"
headerClass="headTab" rows="3"
rendered="#{jsfGridUtenti.renderPanelReportVisibility}">
<f:facet name="footer">
<rich:datascroller for="dataTableVisibility"
fastStep="10" pagesVar="pageCountCl"
pageIndexVar="pageIndexCl"
maxPages="9" renderIfSinglePage="false"
selectedStyle="font-weight:bold;">
</rich:datascroller>
</f:facet>
<h:column>
<f:facet name="header">
#{applicationMessages.ruolo}
</f:facet>
<a4j:commandLink reRender="reportUserVisibilityCompanyRoleClass" action="#{jsfGridUtenti.deleteAssociationRole(roleName)}">
<h:graphicImage styleClass="toolbarLabel" url="../resources/img/cancella.png" />
</a4j:commandLink>
<rich:spacer height="1" width="8" />
<h:outputText style="font-size:11px" value="#{roleName}"/>
</h:column>
<h:column>
<f:facet name="header">
#{applicationMessages.companyAssociate}
</f:facet>
<h:column>
<rich:dataTable id="dataTableCompany"
var="company" value="#{jsfGridUtenti.findCompanyInHashMap(roleName)}"
style="width:100%" rows="5"
rowClasses="rdispari,rpari"
columnsWidth="10%,10%,80%"
headerClass="headTab">
<f:facet name="footer">
<rich:datascroller for="dataTableCompany"
fastStep="10" pagesVar="pageCountCls"
pageIndexVar="pageIndexCls"
maxPages="9" ajaxSingle="true"
selectedStyle="font-weight:bold;"
renderIfSinglePage="false">
</rich:datascroller>
</f:facet>
<h:column>
<a4j:commandLink reRender="reportUserVisibilityCompanyRoleClass" action="#{jsfGridUtenti.deleteAssociationCompany(roleName,company)}">
<h:graphicImage styleClass="toolbarLabel" url="../resources/img/cancella.png" />
</a4j:commandLink>
</h:column>
<h:column>
<a4j:commandLink immediate="true" action="#{jsfGridUtenti.setCompanyToShow(roleName,company)}"
reRender="showClassi,panelGridReport">
<h:graphicImage styleClass="toolbarLabel" url="../resources/img/lente.png" />
</a4j:commandLink>
</h:column>
<h:column>
<h:outputText style="font-size:11px" value="#{company.label}"/>
</h:column>
</rich:dataTable>
</h:column>
</h:column>
</rich:dataTable>
Now when I click on the outer rich:dataScroller it works well, instead when I click on the inner nothing happens. How can I fix?
This is a known issue. rich:datascroller doesn't support nested iteration components such as dataTable, repeat etc.
There is a JIRA issue for this.
Did you say 'nothing happens'? Did you look at your console? Doesn't it display a warning like this?
The requested page #2 isn't found in the model containing 1 pages. Paging is reset to page #1
I got the same warning message and solved it by adding a session variable like:
<rich:dataScroller for="table" page="#{sessionBean.page}" />
In my case the bean wasn't accessible (due to scope) before I changed the code. I was on the wrong track because I would have expected a warning/error pointing out that the problem is related to the expression language.

How can i transfer a column value to my managed bean?

I am using a datatable in JSF:
<h:dataTable var="dataItem" value="#{operationsBean.creneauxMedecin}" border="1">
<f:facet name="header">
<h:outputText value="Rendez-vous de #{operationsBean.medecin.titre} #{operationsBean.medecin.prenom} #{operationsBean.medecin.nom} le #{operationsBean.txtJour}"></h:outputText>
</f:facet>
<h:column>
<f:facet name="header">
<h:outputText value="Créneau horaire"></h:outputText>
</f:facet>
<h:outputText id="id" value="#{dataItem.hdebut}h#{dataItem.mdebut}-#{dataItem.hfin}h#{dataItem.mfin}"/>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Client"/>
</f:facet>
<h:outputText value="#{operationsBean.clt }"/>
</h:column>
</h:dataTable>
Please how can i transfer a column's(((dataItem.id))) value to my managed bean ?
N.B dataItem is a datatable row that contains(id,version,hdebut,mdebut....)
You have to implement an action listener method in your managed bean and call that via a command link and pass a param as part of the tag, if you google you can see many examples.
<h:commandLink value="click me" actionListener="#{managedbean.actionListenerMethod}">
<f:param name="paramInternalId" value="#{dataTableIter.id}" />
</h:commandLink>
http://docs.oracle.com/javaee/5/tutorial/doc/bnaqd.html#bnaqj

how to restrict a Data to display in a row in datatable in JSF

There is any possible to restrict the data display in the datable based on c:if .
Let say
Output shown now:
Startdate end date status Edit
2012-02-02 2012-03-02 Waiting edit
2012-02-03 2012-03-04 Approved edit
Output Expected:
Startdate end date status Edit
2012-02-02 2012-03-02 Waiting edit
2012-02-03 2012-03-04 Approved
When the status is Waiting then the edit link should be shown.when it is rejected or approved then the edit link should not be shown
This is my Xhtml file.
<h:form>
<h:dataTable value="#{employeeleave}" var="e"
styleClass="order-table"
headerClass="order-table-header"
rowClasses="order-table-odd-row,order-table-even-row"
columnClasses="order-table-odd-column,order-table-even-column"
>
<h:column>
<f:facet name="header">
Start Date
</f:facet>
#{e.startDate}
</h:column>
<h:column>
<f:facet name="header">
End Date
</f:facet>
#{e.endDate}
</h:column>
<h:column>
<f:facet name="header">
Reason
</f:facet>
#{e.reason}
</h:column>
<h:column>
<f:facet name="header">
Status
</f:facet>
#{e.status}
</h:column>
<h:column>
<f:facet name="header">
Edit
</f:facet>
<c:if test="${e.status == 'Waiting'}">
<p:commandLink value="Edit" action="editLeave" id="editleave" >
<f:setPropertyActionListener value="#{e}" target="#{employeeDetails.employeeLeaveSelected}" />
</p:commandLink>
</c:if>
</h:column>
</h:dataTable>
</h:form>
JSTL tags doesn't work that way. They runs during view build time, not during view render time which is what you seem to expect. The ${e} is not available during view build time and would in your particular case thus always resolve to null.
You need to use the JSF component's rendered attribute instead.
Replace
<c:if test="${e.status == 'Waiting'}">
<p:commandLink value="Edit" action="editLeave" id="editleave" >
<f:setPropertyActionListener value="#{e}" target="#{employeeDetails.employeeLeaveSelected}" />
</p:commandLink>
</c:if>
by
<p:commandLink value="Edit" action="editLeave" id="editleave" rendered="#{e.status == 'Waiting'}">
<f:setPropertyActionListener value="#{e}" target="#{employeeDetails.employeeLeaveSelected}" />
</p:commandLink>
See also:
JSTL in JSF2 Facelets... makes sense?

Exception thrown while accessing HTML DataTable in backing bean

I am building a simple application in JSF with the CrUD functionality. I am trying to implement edit functionality using the tomahawk component .I am unable to retrieve the selected row in my backing bean.
Here's my JSP file snip:
<t:dataTable id="data"
binding="#{selectOneRowList.dataTable}"
styleClass="scrollerTable"
headerClass="standardTable_Header"
footerClass="standardTable_Header"
rowClasses="standardTable_Row1,standardTable_Row2"
columnClasses="standardTable_Column,standardTable_ColumnCentered,standardTable_Column"
var="car"
value="#{selectOneRowList.list}"
sortColumn="#{selectOneRowList.sortColumn}"
sortAscending="#{selectOneRowList.sortAscending}"
preserveDataModel="false"
preserveSort="true"
preserveRowStates="true"
rows="10"
>
<h:column>
<f:facet name="header">
<h:outputText value="Select"/>
</f:facet>
<t:selectOneRow groupName="selection" id="hugo" value="#{selectOneRowList.selectedRowIndex}"
onchange="submit();" immediate="true"
valueChangeListener="#{selectOneRowList.processRowSelection}"/>
</h:column>
<h:column>
<f:facet name="header">
</f:facet>
<h:outputText value="#{car.id}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Cars" />
</f:facet>
<h:outputText value="#{car.type}" />
</h:column>
<t:column sortable="true">
<f:facet name="header">
<h:outputText value="Color" />
</f:facet>
<h:outputText value="#{car.color}" />
</t:column>
</t:dataTable>
Here's my backing bean SelectOneRowList.java :
public void editCar(ActionEvent event) {
System.out.println("Row number ## " + _selectedRowIndex.toString() + " selected!");
System.out.println("Datatable ::"+ dataTable);
System.out.println("Row Count ::" + dataTable.getRowCount());
dataItem = (SimpleCar) getDataTable().getRowData();
//selectedCar = (SimpleCar) _list.get(Integer.parseInt(_selectedRowIndex.toString()));
selectedCar = (SimpleCar) dataTable.getRowData();
System.out.println(dataTable.getRowData());
}
My DTO{Data Transfer Object} which is SimpleCar.java contains the variables ID, type, color and their respective setters/getters.
The dataItem variable is of type "SimpleCar". The dataTable is of type HTMLDataTable. I am able to get the the first 3 SOP's but the 4th SOP isn't printed. I receive the following exception on the server :
javax.faces.el.EvaluationException: Exception while invoking expression #{selectOneRowList.editCar}
org.apache.myfaces.el.MethodBindingImpl.invoke(MethodBindingImpl.java:156)
javax.faces.component.UICommand.broadcast(UICommand.java:89)
javax.faces.component.UIViewRoot._broadcastForPhase(UIViewRoot.java:97)
javax.faces.component.UIViewRoot.processApplication(UIViewRoot.java:171)
org.apache.myfaces.lifecycle.InvokeApplicationExecutor.execute(InvokeApplicationExecutor.java:32)
org.apache.myfaces.lifecycle.LifecycleImpl.executePhase(LifecycleImpl.java:95)
org.apache.myfaces.lifecycle.LifecycleImpl.execute(LifecycleImpl.java:70)
javax.faces.webapp.FacesServlet.service(FacesServlet.java:139)
org.apache.myfaces.webapp.filter.ExtensionsFilter.doFilter(ExtensionsFilter.java:341)
On click of the edit button the editCar method in my backing bean is invoked. I need to get the data of the selected row in my backing bean. Why is the exception occurring ?
The above example is taken from the tomawhawk examples WAR distributed on the website. I have gone through many links including the ones on BalusC but none of them have helped.
Regards,
To use DataTable.getRowData() you would have to put the button tied to editCar() within the data table. So, on your JSP would need to add another column, such as:
...
<t:column sortable="true">
<f:facet name="header">
<h:outputText value="Color" />
</f:facet>
<h:outputText value="#{car.color}" />
</t:column>
<t:column sortable="false">
<h:commandButton value="Edit" action="#{selectOneRowList.editCar}" />
</t:column>
</t:dataTable>

Resources