I want to show the data from an DataList in one row. Here is a picture to show what I want to do https://www.dropbox.com/s/p7pcn67bt0304lo/pic.JPG
I use primefaces 4.0 and jsf 2.1
<p:dataTable id="sentTable" var="task" value="#{taskboxBean.taskboxSentList}" paginator="true"
rows="5" selection="#{taskboxBean.selectedTaskbox}" selectionMode="single" rowKey="#{task.ID}"
paginatorPosition="bottom" emptyMessage="">
<p:ajax event="rowSelect"
update=":contentForm, :postForm:tabViewPosts:trashTable, :postForm:tabViewPosts:inboxTable, :postForm:tabViewPosts:sentTable"
listener="#{taskboxBean.onTaskboxRowSelect}" />
<p:column headerText="Post">
<p:dataGrid var="task_to_user" value="#{task.TASKBOX_TO_USERS}" emptyMessage="Keine Daten">
<p:scrollPanel>
<p:outputLabel
value="#{task_to_user.USER.FIRST_NAME} #{task_to_user.USER.LAST_NAME} #{task_to_user.USER.EMAIL}" />
</p:scrollPanel>
</p:dataGrid>
<h:outputText value="#{task.TASKTYPE.NAME}" />
<br />
<h:outputText value="#{task.CREATE_TIMESTAMP}" />
</p:column>
</p:dataTable>
try This
<p:dataGrid var="task_to_user" value="#{task.TASKBOX_TO_USERS}" emptyMessage="Keine Daten" rows="1" />
Assigning 1 row only
Related
I'm nesting a datable in tabview. On the first page its all working correctly and i can edit the table, but after i switch the tabs, the datatable isnt editable anymore.
Is there something i'm doing wrong?
Using Primefaces 5.3
<h:form id="form">
<p:tabView id="tabs" value="#{studentsTableView.exams}" activeIndex="#{studentsTableView.activTab}" dynamic="true" var="exam" binding="#{tabView}" cache="false" >
<p:ajax event="tabChange" update="form:tabs" />
<p:tab id="tab" title="#{exam.name}">
<p:dataTable id="students" rowIndexVar="rowIndex" var="student" editable="true" widgetVar="gradetable" editMode="cell" tableStyle="width:auto" styleClass="myTable" value="#{studentsTableView.students}">
<p:ajax event="cellEdit" update="students" />
<p:column headerText="Nr">
<h:outputText value="#{rowIndex+1}" />
</p:column>
<p:column headerText="Vorname">
<h:outputText value="#{student.vorname}" />
</p:column>
<p:column headerText="Nachname">
<h:outputText value="#{student.nachname}" />
</p:column>
<p:column headerText="Matrikelnummer">
<h:outputText value="#{student.matrikelnummer}" />
</p:column>
<p:columns value="#{exam.allExams}" var="subexam" columnIndexVar="colIndex">
<f:facet name="header">
<h:outputText value="#{subexam.examName}" />
</f:facet>
<p:cellEditor>
<f:facet name="output"><h:outputText id="modeloutput" value="#{studentsTableView.getGrade(subexam, student)}" /></f:facet>
<f:facet name="input"><p:inputText id="modelInput" value="#{studentsTableView.currentGrade}" valueChangeListener="#{studentsTableView.insertGrade(subexam, student)}" style="width:90%">
<p:ajax event="change" update="modelInput" />
<p:ajax event="change" update="modeloutput" />
<p:ajax event="change" update="modeloutput" />
<p:ajax event="change" update=":form:tabs:0:students" />
</p:inputText></f:facet>
</p:cellEditor>
</p:columns>
<p:column id="endgrades" headerText="Endnote">
<h:outputText id="endgrade" value="#{studentsTableView.getEndGrade(exam, student)}" />
</p:column>
<p:column headerText="Formel">
<p:selectBooleanButton id="value1" value="true" onLabel="Yes" offLabel="No" style="width:60px" />
</p:column>
<p:column headerText="Kommentar">
<p:commandButton id="public" icon="ui-icon-comment" type="button" >
<p:ajax event="click" listener="#{studentsTableView.setPublicCommentInfos(exam, student)}" update="publicarea" />
</p:commandButton>
<p:overlayPanel id="imagePanel" for="public" hideEffect="fade">
<h:inputTextarea id="publicarea" value="#{studentsTableView.publicComment}" >
<p:ajax event="change" update="publicarea" />
</h:inputTextarea>
</p:overlayPanel>
<p:commandButton id="private" icon="ui-icon-locked" type="button" >
<p:ajax event="click" listener="#{studentsTableView.setPrivateCommentInfos(exam, student)}" update="privatearea" />
</p:commandButton>
<p:overlayPanel id="privatepanel" for="private" hideEffect="fade">
<h:inputTextarea id="privatearea" value="#{studentsTableView.privateComment}" >
<p:ajax event="change" update="privatearea" />
</h:inputTextarea>
</p:overlayPanel>
</p:column>
</p:dataTable>
</p:tab>
</p:tabView>
</h:form>
Your problem could be because you're still referencing the datatable id from the first tab, even though you switched to another. You could try to create a different id for each datatable from each tab and then working with those ids and updating them.
We use primeface 5.1, JSF 2.2 for our project.
I have a problem in the primefaces datatable, after filtering the datatable, the sort will be broken, no record will show in the datatable if trying to sort the table. The following is the jsf code and the issue snapshot.
<p:dataTable id="myTable" var="model" value="#{myBean.dynaModels}" widgetVar="tableWidget" editable="true" styleClass="ui-dyna-table"
rows="10" paginator="true" resizableColumns="true" tableStyle="width:auto" filterEvent="enter" emptyMessage="No service order found"
paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown} {CurrentPageReport}" draggableColumns="true"
currentPageReportTemplate="{startRecord} - {endRecord} of {totalRecords}" paginatorPosition="top" rowsPerPageTemplate="10,20,50,100" style="margin-right: 5px">
<f:facet name="header">
<p:commandButton id="toggler" type="button" value="Columns" style="float:right" icon="ui-icon-calculator" />
<p:columnToggler datasource="myTable" trigger="toggler" />
</f:facet>
<c:forEach items="#{myBean.columnProperties}" var="columnProperty" >
<p:column headerText="#{columnProperty.descr}" rendered="#{columnProperty.componentType.value eq 'S1'}" filterBy="#{model.dyanModelMap[columnProperty.propertyKey].value}"
sortBy="#{model.dyanModelMap[columnProperty.propertyKey].value}" filterMatchMode="exact">
<f:facet name="filter" >
<p:selectOneMenu style="width:111px" onchange="PF('tableWidget').filter()" >
<f:selectItem itemValue="" noSelectionOption="true"/>
<f:selectItems value="#{columnProperty.lov}" />
</p:selectOneMenu>
</f:facet>
<h:outputText value="#{model.dyanModelMap[columnProperty.propertyKey].value}" />
</p:column>
<p:column headerText="#{columnProperty.descr}" rendered="#{columnProperty.componentType.value eq 'TXT'}" filterBy="#{model.dyanModelMap[columnProperty.propertyKey].value}"
sortBy="#{model.dyanModelMap[columnProperty.propertyKey].value}" filterMatchMode="contains">
<h:outputText value="#{model.dyanModelMap[columnProperty.propertyKey].value}" />
</p:column>
<p:column headerText="#{columnProperty.descr}" rendered="#{columnProperty.componentType.value eq 'DT'}" filterBy="#{model.dyanModelMap[columnProperty.propertyKey].value}" sortBy="#{model.dyanModelMap[columnProperty.propertyKey].value}">
<f:facet name="filter" >
<p:calendar showOn="button" onchange="PF('tableWidget').filter()" >
</p:calendar>
</f:facet>
<h:outputText value="#{model.dyanModelMap[columnProperty.propertyKey].value}" />
</p:column>
</c:forEach>
Add and implement the filteredValue attribute in datatable. That fixed it for me.
I want increment visible rows of p:dataTable when click on p:outputLink. Here is picture:
and my code is:
<p:dataTable value="#{tasks}" styleClass="dashTable"
var="tasklar" rows="5" lazy="true"
selection="#{flowScope.selectedTask}" selectionMode="single" >
<p:ajax event="rowSelect" />
<p:column headerText="#{messages.label_task_temasy}">
<h:outputText value="#{tasklar.taskTemasy}"/> </p:column>
</p:dataTable>
Thank`s for help.
I have resolved my problem. Here is code:
<h:form id="dataForm">
<p:dataTable value="#{tasks}" styleClass="dashTable"
var="tasklar" rows="#{taskCriteria.pageSize}" lazy="true"
selection="#{flowScope.selectedTask}" selectionMode="single" >
<p:ajax event="rowSelect" />
<p:column headerText="#{messages.label_task_temasy}">
<h:outputText value="#{tasklar.taskTemasy}"/> </p:column>
</p:dataTable>
<p:commandLink style="float:left" update=":dataForm"
action="#{taskCriteria.setPageSize(taskCriteria.pageSize+5)}">
<h:outputText value="Show more..." />
</p:commandLink>
</h:form>
Please help me to find a example to update p:inputtext with data stored in a bean which is set(solved already) by selecting a row of a datatable of a p:dialog. I have succeeded updating outputtext in the same manner.
I am using (learning) netbeans 7.2 primefaces 3.2, glassfish 3.1
thansk for all your help
rs_ncs
Look at primefaces showcase and the user guide, you'll find everything you need; in detail search for rowSelect event for the datatable component. Good luck =)
If you would like to update a component on select of a row from a datatable, then you can use the update attribute of a <p:ajax> which is listening on rowselect event. Something like this:
<p:ajax event="rowSelect" update=":xx:xx" />
As Suggested by BalusC the code <p:ajax event="rowSelect" update=":xx:xx" /> should work....
Here is an example of updating both inputtext and outputtext .
<h:form>
<p:dataTable id="usertable" var="user" value="#{userManageBean.userList}"
rowKey="#{user.U_ID}" selection="#{userManageBean.selectedUser}"
selectionMode="single" paginator="true" rows="18" >
<p:ajax event="rowSelect" update=":useredit:edituser" />
<p:ajax event="rowSelect" update=":viewuser:displayuser" />
<p:column headerText="User Name">
<h:outputText value="#{user.username}" />
</p:column>
<p:column headerText="FName">
<h:outputText value="#{user.firstname}" />
</p:column>
<p:column headerText="LName">
<h:outputText value="#{user.lastname}" />
</p:column>
</p:dataTable>
</h:form>
<p:dialog id="userview" header="View User" widgetVar="dlg2" >
<h:form id="viewuser">
<h:panelGrid id="displayuser" columns="2" cellpadding="4">
<h:outputText value="User Name:" />
<h:outputText value="#{userManageBean.selectedUser.username}" />
<h:outputText value="First Name" />
<h:outputText value="#{userManageBean.selectedUser.firstname}" />
<h:outputText value="Last Name:" />
<h:outputText value="#{userManageBean.selectedUser.lastname}" />
</h:panelGrid>
</h:form>
</p:dialog>
<p:dialog id="user_edit" header="Edit User" widgetVar="dlgedit" >
<h:form id="useredit">
<h:panelGrid id="edituser" columns="2" cellpadding="4">
<h:outputText value="First Name" />
<h:inputText value="#{userManageBean.selectedUser.firstname}" />
<h:outputText value="Last Name" />
<h:inputText value="#{userManageBean.selectedUser.lastname}" />
<p:commandButton id="updateUser" value="Add" action="#{someaction}"
ajax="false" />
</h:panelGrid>
</h:form>
</p:dialog>
I've been running Primefaces 3.0, no issues, and now am trying an upgrade to 3.4.x - I've tried 3.4, 3.4.1, and 3.4.2 and this problem occurs in all 3 - basically for the datatable with the selectionMode="single" option when I click on a row it remains selected no matter how many other rows I select. At the same time I'm quite sure the selection="#{databrowser.selectedData}" variable is not being set when I'm clicking on the rows. The table is fully populated and no 2 rows have the exact same data in all columns. Tested and this occurs in both Chrome and Firefox. I can't find any similar problem posted - wondering if anyone else has had this issue?
Apart from the element referencing this is the 3.0 code I've used:
<p:layoutUnit position="center" resizable="true" header="Data Set Details" styleClass="east_panel_header" >
<h:form id="tblbrowser">
<p:dataTable id="dataTable" emptyMessage="No data sets found." style="width: 100%" var="datlis" resizableColumns="true" value="#{databrowser.selectedDataModel}" widgetVar="dataTable" selection="#{databrowser.selectedData}" selectionMode="single" >
<p:ajax event="rowSelect" update=":usercomments:commentsTable, :tblbrowser:dataTable" />
<f:facet name="header" >
<p:outputPanel>
<h:outputText value="Search all fields " />
<p:inputText id="globalFilter" onkeyup="dataTable.filter()"/>
</p:outputPanel>
</f:facet>
<p:column id="owner" filterBy="#{datlis.uname}" headerText="Added By" filterMatchMode="contains" >
<h:outputText value="#{datlis.uname}" />
</p:column>
<p:column id="name" filterBy="#{datlis.name}" headerText="Name" >
<h:outputText value="#{datlis.name}" />
</p:column>
<p:column id="description" filterBy="#{datlis.description}" headerText="Description" filterMatchMode="endsWith" >
<h:outputText value="#{datlis.description}" />
</p:column>
<p:column id="datatype" filterBy="#{datlis.data_type}" headerText="Data Type"
filterOptions="#{databrowser.dataTypeOptions}" filterMatchMode="exact" >
<h:outputText value="#{datlis.data_type}" />
</p:column>
<p:column id="quality" filterBy="#{datlis.quality}" headerText="Source Type"
filterOptions="#{databrowser.qualityOptions}" filterMatchMode="exact" >
<h:outputText value="#{datlis.quality}" />
</p:column>
<p:column id="added" headerText="Date Added" filterMatchMode="endsWith" >
<h:outputText value="#{datlis.added}" />
</p:column>
<p:column headerText="Metadata" style="width:40px" >
<p:commandButton id="selectButton" rendered="#{datlis.has_metadata}" icon="ui-icon-circle-arrow-s" title="View" ajax="false" >
<f:param name="filepath" value="#{datlis.filepath}" />
<p:fileDownload value="#{filedownloader.mfile}" />
</p:commandButton>
</p:column>
<p:column headerText="Data File(s)" style="width:90px" >
<p:commandButton id="selectButton2" rendered="#{datlis.has_datafiles}" icon="ui-icon-circle-arrow-s" title="View" ajax="false" >
<f:param name="datafiles" value="#{datlis.datafiles}" />
<p:fileDownload value="#{filedownloader2.dfile}" />
</p:commandButton>
<h:outputText value=" " />
<h:outputText value="#{datlis.zipsize}" />
</p:column>
</p:dataTable>
</h:form>
</p:layoutUnit>
You are missing the rowKey attribute which should be the unique identifier of each row.
Example, if your selectedData object has a unique field id, your dataTable component should look like:
<p:dataTable id="dataTable" rowKey=#{datlis.id}
value="#{databrowser.selectedDataModel}" var="datlis"
selection="#{databrowser.selectedData}" selectionMode="single" >
No need to update the same table within p:ajax to see the selection, so you can probably remove the :tblbrowser:dataTable from the update target and have only:
<p:ajax event="rowSelect" update=":usercomments:commentsTable" />