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.
Related
I am using PrimeFaces 5 and using dataexporter to export .xls and pdf file. When i click on export, nothing seems to be happening. Below is my code:
<h:body>
<h:form id="formReport">
<ui:include src="menu.xhtml"></ui:include>
<p:dataTable id="ngoReporttbl" var="obj" styleClass="datatable"
value="#{ngoReportController.ngoReportList}" >
<f:facet name="header">
List of Cars
<p:commandButton id="toggler" type="button" value="columns" style="float:right" icon="ui-icon-calculator"></p:commandButton>
<p:columnToggler datasource="ngoReporttbl" trigger="toggler"></p:columnToggler>
</f:facet>
<p:column>
<f:facet name="header">
<h:outputText value="NGO Id"></h:outputText>
</f:facet>
<h:outputText value="#{obj.ngoId}"></h:outputText>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="NGO Name Org"></h:outputText>
</f:facet>
<h:outputText value="#{obj.ngoNameOrg}"></h:outputText>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Environment"></h:outputText>
</f:facet>
<h:outputText value="#{obj.environment}"></h:outputText>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Livelihood"></h:outputText>
</f:facet>
<h:outputText value="#{obj.livelihood}"></h:outputText>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Country"></h:outputText>
</f:facet>
<h:outputText value="#{obj.country}"></h:outputText>
</p:column>
</p:dataTable>
<h:commandLink style="float:right">
<p:graphicImage value="../images/pdf.png" width="45"></p:graphicImage>
<p:dataExporter type="pdf" target="ngoReporttbl" fileName="ngoReport" pageOnly="true"></p:dataExporter>
</h:commandLink>
<h:commandLink style="float:right">
<p:graphicImage value="../images/csv.png" width="45"></p:graphicImage>
<p:dataExporter type="xls" target="ngoReporttbl" fileName="ngoReport" pageOnly="true"></p:dataExporter>
</h:commandLink>
<ui:include src="footer.xhtml"></ui:include>
</h:form>
</h:body>
Both the dataTable and the Export command are within one form. It is similar to the example given on primefaces.org site. But, I'm unable to export data to pdf, cvs.
For XLS, you don't need anything extra. For PDF, you need POI. Primefaces only works with 2.1.7 due to licensing issues. And your commandButton / commandLink need to be ajax="false". Good luck.
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.
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
I am using one h:selectbooleancheckbox in each row to make 2 columns editable.
Have a look at my JSF page
<h:dataTable id="editTable" styleClass = "listtable" value="#{bean.GroupList}" var="group" border="1" first="0" rows="8" width="75%" frame="hsides" rules="all" cellpadding="5" headerClass="tableheading" rowClasses="firstrow, secondrow">
<f:facet name="header">
<h:outputText value="Groups"></h:outputText>
</f:facet>
<h:column>
<f:facet name="header">
<h:outputText value="GroupId"></h:outputText>
</f:facet>
<h:outputText value="#{group.Id}" rendered="#{not bean.checked[group.Id]}"></h:outputText>
<h:inputText value="#{group.Id}" rendered="#{bean.checked[group.Id]}" required="true"/>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="GroupName"></h:outputText>
</f:facet>
<h:outputText value="#{group.Name}" rendered="#{not bean.checked[group.Id]}"></h:outputText>
<h:inputText value="#{group.Name}" rendered="#{bean.checked[group.Id]}" required="true"/>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Check to Enable/Disable"></h:outputText>
</f:facet>
<h:selectBooleanCheckbox value="#{bean.checked[group.Id]}" />
</h:column>
</h:dataTable>
I have required="true" for GroupId and GroupName columns.
I am not getting where to keep h:messages for each column to display requiredmessage
Please help.
You need to use <h:message> instead to display errors specific to an input element. The <h:messages> will display all messages which are not covered by any <h:message>.
<h:column>
<f:facet name="header">
<h:outputText value="GroupId"></h:outputText>
</f:facet>
<h:outputText value="#{group.Id}" rendered="#{not bean.checked[group.Id]}"></h:outputText>
<h:inputText id="groupId" value="#{group.Id}" rendered="#{bean.checked[group.Id]}" required="true"/>
<h:message for="groupId" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="GroupName"></h:outputText>
</f:facet>
<h:outputText value="#{group.Name}" rendered="#{not bean.checked[group.Id]}"></h:outputText>
<h:inputText id="groupName" value="#{group.Name}" rendered="#{bean.checked[group.Id]}" required="true"/>
<h:message for="groupName" />
</h:column>
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.