I want to hide some columns in a dataTable(e.g id,serial),the columns will be rendered because javascript need access the value of the columns.
Any idea?
You can use display: none or visibility: hidden. You can find the difference in here: What is the difference between visibility:hidden and display:none?
Whatever you use, you will have access with javascript to those elements.
Also you can find here a interesting point of view regarding the usage of display:none.
Just set the "rendered" attribute to "false":
<p:column rendered="false">
...
</p:column>
Did you try this:
<p:column style="display: none" //...
If you are using Prime NG, for angular, in p-column you can add attribute [hidden]="true". That solved my issue. Also, that column will show up in export CSV function which is kind of cool.
Related
I'm working with a DataTable, and I'm having some trouble displaying a value from an EL in the footer. I have made a simplified version of my xhtml that still reproduces the error.
If I do the p:dataTable like this it all works:
<p:dataTable value="#{myMB.items}" var="item">
<p:column headerText="Value" footerText="Value">
<h:outputText value="#{item.value}">
<f:convertNumber pattern="###,##0.00"/>
</h:outputText>
</p:column>
</p:dataTable>
I get this as a result:
The footer shows just fine. And then I try it with EL, changing the column definition like this:
<p:column headerText="Value" footerText="#{3 + 11}">
<h:outputText value="#{item.value}">
<f:convertNumber pattern="###,##0.00"/>
</h:outputText>
</p:column>
And it evaluates my expression, I get this as a result:
It shows the correct value 14 in the footer. But when I try to use a value from my model, it doesn't show. See the example:
Code:
<p:column headerText="Value" footerText="#{item.value}">
<h:outputText value="#{item.value}">
<f:convertNumber pattern="###,##0.00"/>
</h:outputText>
</p:column>
Output:
And I have tried to do the footer in different ways. Not a single attempt worked.
Is there a correct way to do this? In the showcase it seems to work just fine.
I am using PrimeFaces 3.3.1
The problem was lack of attention.
I failed to realize that I have multiple column values for a single footer. And since JSF can't decide on a single value, it shows nothing.
Shortly after I posted this the answer came to me. I tried to define a single value on my ManagedBean to use as footer, and it work just fine.
Again, there's nothing wrong with JSF and/or PrimeFaces, it was just lack of logical thinking from my part.
It works on the showcase, because it shows subtables that actually do have a footer for each value.
I have a Firefox extension that contains a textbox:
<textbox id="exclude-text" flex="1" rows="10" multiline="true" style="min-width: 25em;" wrap="off" value="0" persist="value"/>
A user enters some text in the text box. I need this text to persist across sessions.
I found this info on the "persist attribute", but in my case it does not work.
Is there any way to make it work or any simple workaround?
Thank you!
The persist attribute can only store attributes - yet the value attribute of a text field doesn't change when text is being entered, only the value property. As far as I know, the only work-around is keeping the value attribute in sync with the value property manually, something like this:
<textbox id="exclude-text" value="0" persist="value"
oninput="this.setAttribute('value', this.value);document.persist(this, 'value')"/>
Calling document.persist() is necessary unfortunately, changing attributes manually normally doesn't trigger persistance.
For reference: this is bug 111486, a XUL limitation first noted in 2001.
<h:panelGrid columns="2">
<h:outputText value="Search Results List"/>
<p:commandButton value="Add user" process="#this" styleClass="btn-primary" style=" margin-bottom: 20px;margin-left: -80px;width:75px;" action="#{testBean.addUser(user)}"/>
<p:orderList styleClass="resultBox" style="color: #263F6A;" var="user" value="#{testBean.contacts}"
itemLabel="#{user.firstName}" itemValue="#{user.firstName}" controlsLocation="none">
</p:orderList>
</h:panelGrid>
I was working with primefaces orderlist, I have managed to get orderlist from backend, now I have select one of item from orderist and have to send it to server side to query.. I have posted the above code to do that.. I am facing problems as user object is null.. How to send an selected item from orderlist and send it across the server also please explain me about the process="#this" . I am using primefaces 3.4.2 and JSf2 websphere8.
Thanks in advance
p:orderList is not a data component. You cannot send data to the backend like that. Check this. Try using dataTable and displaying value in it. You can use f:setPropertyActionListener for dataTable.
Also to know about #this check this link
Edit: Check primefaces showcase to pass the data using datatable and also this
Use selectOneListbox instead. The only difference is, that you have to implement the ordering by yourself.
http://www.primefaces.org/showcase/ui/selectOneListbox.jsf
I'm using Primefaces and MyFaces. I would like to use the selectBooleanButton component, to control visibility of other components within a long and rather complex form.
simplified sample code:
<p:selectBooleanButton
onLabel="Comment" offLabel="Comment"
onIcon="ui-icon-check" offIcon="ui-icon-close"
value="#{not empty myBean.comment}"
onchange="toggleDisplay(this.checked,'myForm:commentPanel');" />
<h:panelGroup id="commentPanel"
style="display:#{empty myBean.comment ? 'none' : 'block'}">
<p:inputTextarea value="{myBean.comment}"/>
</h:panelGroup>
The javascript in the onchange attribute simply toggles the display style from none to block and vice-versa to hide or unhide the panel group. I want/need the components to remain in the view, I do not want to use rendered attributes to remove them completely.
Where I get into trouble is because of the EL construct used in the value attribute of the setBooleanButton component. I do realize that this EL statement is not compatible with the set operation, and this results in an exception.
What I want to be able to do is when the form is loaded, have the initial status of the selectBooleanButton components set to 'on' when the comment property has some existing text it, and 'off' when it is empty. I am looking for a way to work around this that would not require me to create a property in the model for each and every instance where I want to hide the panel, as that would result in dozens and dozens of properties because my real world form is very large with many of these comment sections.
I also posted this question on Primefaces forum, and did not receive any answers there either, so at this time there may not be a great solution to this problem, or at least not one that has been shared. What I ended up doing to work around this is to create two versions of the component, and use the rendered attribute to control which one is used, like this:
<p:selectBooleanButton
onLabel="Comment" offLabel="Comment"
onIcon="ui-icon-check" offIcon="ui-icon-close"
value="true" rendered="#{not empty myBean.comment}"
onchange="toggleDisplay(this.checked,'myForm:commentPanel');" />
<p:selectBooleanButton
onLabel="Comment" offLabel="Comment"
onIcon="ui-icon-check" offIcon="ui-icon-close"
value="false" rendered="#{empty myBean.comment}"
onchange="toggleDisplay(this.checked,'myForm:commentPanel');" />
I am using PrimeFaces 3.2 with JSF 2 in a glassfish 3.1.2.
I have a <p:dataTable> which displays search results containing information on different issues (the issues are assigned to users).
If somebody clicks on the icon of the assigned user a <p:dialog> pops up.
The user icon and the according dialog are implemented using a composite.
Inside the composite I am using some jQuery functions which need a unique ID for each dialog component - I am not able to find a way to solve this problem.
My investigations so far:
I need to set the widgetVar attribute, which works fine as long as I have only one user in the list but it seems that inside a dataTable the widgetVar is not unique for many composites.
Since the user can be displayed more than one time inside the search result, I am not able to setup an widgetVar like this:
<ui:param name="myWidgetVar" value="widget_#{user.id}" />
and use it this way
<p:dialog widgetVar="#{myWidgetVar}">
also using #{cc.id} does not resolve the problem 'cause it only returns the id of the widget without the naming-container part which is always the same.
I need the complete id as displayed in html (e.g.: form:jdt123:dialog:456) - how can I get this?
Does anyone know what to do?
Thanks Pete
My solution is using #{cc.clientId} which I did not know yet.
This gives me the complete html element id constisting of the series of identifiers glued with the UINamingContainer#getSeparatorChar (e.g.: form:jdt123:dialog:jdt456)
Thanks for the answer. You solved my unrelated problem, but I think I stumbled on another solution for your problem.
From the PrimeFaces user guide (http://primefaces.org/documentation.html):
8.2 EL Functions
PrimeFaces provides built-in EL extensions that are helpers to common use cases.
Common Functions
Component
<h:form id="form1">
<h:inputText id="name" />
</h:form>
//#{p:component(‘name’)} returns ‘form1:name’
WidgetVar
<p:dialog id="dlg">
//contents
</p:dialog>
<p:commandButton type="button" value="Show" onclick="#{p:widgetVar(‘dlg’)}.show()" />
It looks like you would be most interested in the WidgetVar implementation.