I have datatable with multiple checkbox selection (PF 3.3.1). I've defined column:
<p:column selectionMode="multiple"/>
I would like add some text or icon to header and I tried with headerText column attribute and with facet:
<f:facet name="header">
<h:outputText value="Header text" />
</f:facet>
But it doesn't work.
It is possible to modify header of checkbox selection column?
In case you want that feature badly and don't mind to use jquery, You could do something like
I tested it on primefaces shocase and it works (run these command at the console)
$("<span class='someClass'>Hellow</span>").insertAfter($('#form\\:multiCars thead tr:eq(2) th').find('.ui-chkbox-box'))
note that #form\\:multiCars should be changed with your table id
and tr:eq(2) refers to the third row in the table , cause in showcase the row with the headers is third
to change the width of that selection column you can use
$($('#form\\:multiCars thead tr:eq(2) th')[0]).css('width',100)
I'm aware of the fact that its waaaay ugly , but it works :)
Also you will have to run this script after each ajax rendering of the table
Related
So I have a small bug to fix, this part of code isn't written by me, so I don't really know why this happening.
So there is a <p:dataTable> in a <p:tab>
and first column is just a a checkBox to put a checkMark on particular row or to check all rows in a table.
So when I check first checkbox it checks every row, but it doesn't put a check mark on it's self..
Any ideas why is that?
This is the markup for this column:
<p:column style="width:16px;text-align:center" selectionMode="multiple" rendered="#{!serviceFolder.isAccess}"/>
using JSF , primefaces 5.1
Using
<p:dataTable
id="myissues"
value="{myIssuesController.myIssuesListModel.issueList}"
var="issueElement"
selection="#{issue}"
selectionMode="single"
rowKey="#{issueElement.idIssue}"
>
along with:
<p:ajax
event="rowSelect"
listener="#{myIssuesController.onSelectOneRow}"
update=":issueDetail"
oncomplete="PF('issueDetail').show();"
/>
I can open a dialog when I select a row on my dataTable.
How can I add an editable column to my table that goes into edition mode instead of opening the detail dialog when I click on one of its cells?
My first idea is to simply make the column editable and execute an oncomplete function that checks if the column selected is editable:
If it is, it will let it go into edition mode; if not it will call PF('issueDetail').show(); and show the detail dialog.
Only I don't know how to check if a particular column has been selected. How can I do that?
Should I do it like this or is there a simpler solution?
I solved using primefaces selection.
Basically, I removed the <p:ajax> component and added an extra column with a magnifier icon and a row editor icon to open the detail dialog / edit the entry; which is a more intuitive and user friendly solution than using the row selection action. The extra column looks like this:
<p:column style="width:32px;text-align: center">
<p:commandButton update=":issueDetail"
action="#{myIssuesController.onSelectOneRow}"
oncomplete="PF('issueDetail').show()"
icon="ui-icon-search" title="View" />
<p:rowEditor />
</p:column>
I have a dataTable with a list of employees.
One column of the dataTable is the names of the employees.
I want to have an inputText inside the header of the column which the user can use to filter the employees by their names, e.g. when the user writes "smi" in the inputText, the dataTable should only show the employees with the name starting with "smi" like Smith. The table data should update while the user is writing into the inputText, that is why I am using ajax here.
This is my column:
<h:column>
<f:facet name="header">Name
<h:form>
<h:inputText id="suchString" class="suchString"
value="#{mitarbeiteransicht.suchString}">
<f:ajax event="keyup" execute="suchString" render="ma-tabelle" />
</h:inputText>
</h:form>
</f:facet>
#{ma.bezeichnung}
</h:column>
ma-tabelle is my dataTable.
Everytime the table is rendered, the inputText inside the header is losing the focus and the user needs to click it again.
Is there a way around this? Is it possible to exclude the table headers when rerendering?
I am using primefaces 3.5
I have a p:selectonemenu in one of the column in datatable. and also I have a submit button on another column of same datatable. When I do a submit the row will get removed.
Here when I am selecting 'Other' then do a submit action and updating the form, the p:selectonemenu items in other rows is getting 'other' as first value. What is way to set 'other' to last value everytime
<p:column headerText="Buyer Response" style="white-space:pre-line;">
<p:selectOneMenu value="#{buyerInProcessBean.subject}"
id="buyerResponseId" >
<f:selectItems
value="#{buyerInProcessBean.subjectMap[trans.decisionrule.ruleId]}"
var="subject" itemLabel="#{subject}" itemValue="#{subject}"></f:selectItems>
<f:selectItem itemLabel="Other" itemValue="Other" ></f:selectItem>
</p:selectOneMenu>
</p:column>
Since you have
<p:selectOneMenu value="#{buyerInProcessBean.subject}">
The subject is shared between all rows, of course, other select menus will have the same value as the one selected (other in your case). For that, I suggest a simple fix, you have to move the subject attribute to the objects you are iterating on.
Another fix, is to set the subject attribute to "Other" once your method executed on submit is finished. But with this, even the changed selectmenu will lose "Other" as value.
So in conclusion, you have to change your logic, so that subject won't be shared between rows
I am looking for a way to implement a expand functionality to the rows of a Richfaces DataTable. The user would click a "+" link located in the first column (of each row) of the Datatable and the row would "expand" (meaning new text would be shown between the current row and the next).
I have that working, the only problem is that all the information in the expanded view is displayed in the first column section of that row. What I am trying to do is to show the "expanded" text in the whole row (as if the "expanded" text row is not divided by the columns).
Any suggestions? I'm a bit new at jsf/richfaces, so any sample code would be appreciated.
You can do this with the breakBefore attribute on the rich:column component. There is an example of its use on the RF demo page.
It would work for you if you had the last column define the breakBefore attribute. An example:
<rich:dataTable id="mytbl" value="#{mybean.mydata}" var="row">
<rich:column>
<a4j:commandLink reRender="mytbl">
<h:graphicImage value="#{row.toggleImage}"></h:graphicImage>
<a4j:actionparam name="shown" value="#{not row.expand}" assignTo="#{row.expand}"/>
</a4j:commandLink>
</rich:column>
<rich:column>
<f:facet name="header">col 2</f:facet>
<h:outputText value="#{row.col2}"/>
</rich:column>
<rich:column breakBefore="true">
spans all the other columns
</rich:column>
</rich:dataTable>
One way for this is you can use the JQuery feature.
Demo link http://jsfiddle.net/BU28E/1/ .
One extra overhead here is you need to check how the rich:dataTable renders as Html and provide the DOM model for jQuery. It is bit tricky to have such feature in richfaces and it needs some complex workarounds.