I was wondering if it is possible to create more complex itemLabel for the primefaces picklist. Basically I am using the picklist as a way for users to move a contact (think Outlook contact) from one list to another list. The code I have for itemLabel looks like this:
itemLabel="#{contact.firstName} #{contact.lastName} #{contact.email}"
This leads to each 'item' looking sloppy and makes it difficult to space properly. I would prefer to have 2 (or more) "columns" within the itemLabel, so it can be spaced appropriately. If this is not possible, is there another component that I could use that would be more appropriate for this type of user interaction? Any help is appreciated.
You can use p:column tag inside pick list to define more columns, and better organize list presentation to user. Structure would be something like this:
<p:pickList>
<p:column></p:column>
<p:column></p:column>
</p:pickList>
You can check second example on Primefaces showcase
Related
I'm in the process of rewriting a (very) big and old Richfaces application using Primefaces. I now have a situation where I get two lists, one with column names and one with objects that should be represented as rows.
The object looks like this:
public class AVeryGenericThingThatIDoNotLike {
Object[] values;
//Other parameters that I dont care about
}
When I should display this I want it to map values[0] to the first column, values[1] to the second and so forth.
I have looked at the primefaces showcase and there is an example of dynamic columns but I have tried that and I can not get it to work when I do not know what columns that can exist. The reason that I do not know this is that the columns are decided from a database that holds a row saying what columns that should exist and this can change, so I can not build a class to have all the columns available like in the showcase example.
Can anyone give me any pointers here? I've been stuck on this for a few days and I really need help.
EDIT: Now it is kinda working with the solution from Laabidi Raissi. My problem now is that for some columns I want to have buttons being rendered and command links. With this approach I am only able to get strings and if I try to return objects like CommandButtons it will just print a java object hash.
If you are using JSF2, then I think this solution may work for you. First, in your managed bean, you build your list of columns (dynamically) from DB, and then:
<p:columns value="#{yourManagedBean.listOfColumnsFromDB}" var="column" columnIndexVar="colIndex">
<f:facet name="header"> #{column}</f:facet>
<h:outputText value="#{yourManagedBean.values[colIndex]}" />
</p:columns>
EDIT: Base on your comment, I think adding commandbutton or outputlink is very obvious (instead of the outputText):
<h:commandButton value="#{yourManagedBean.values[colIndex]}" action="#{yourManagedBean.someActionThatTakesAParam(colIndex)}" rendered="#{colIndex == 4}"/>
Supposing you want commandButton in column 5.
Is that what you are looking for ?
Hope this helps
I'm new to JSF and I'd like your suggestions on how to implement what I need the best way possible. Also first post in StackOverflow, so please excuse me if I'm not clear about something.
I've a p:tabView with a dynamic amount of tabs, generated with c:foreach in the following way, with a view scoped backing bean.
<p:tabView id="tabViewId">
<c:forEach items="#{controller.list}" var="aTab">
<p:tab title="#{aTab.label}">
<ui:include src="#{aTab.firstUrl}"/>
</p:tab>
</c:forEach>
</p:tabView>
This works and I'm happy with it. Now the thing is each of my tabs have two possible views, and when a certain event is fired (a p:commandLink is clicked in one of the views) I'd like to change what is shown in the tab to the other view that tab has; in other words, I'd like to change the src view that is loaded inside the tab with ui:include. I've tried to return my desired view path in the method associated to this commandLink in the controller, but as expected it redirects to a new page instead of loading it inside the tab.
I'd like to keep the same controller instance when switching the tab contents (my controller is view scoped), and avoid binding.
I've came with two options.
First would be trying something similar to this (obtained from primefaces tabView different tab content with dynamic tabs), getting the view paths from my "aTab" instead of hardcoding them, and then trying to update the tab or the whole tabView on my commandLink after changing the boolean that switches between the two pages in the controller:
<ui:include
src="#{curSearch.closeable ? '/sections/search/searchInstanceTab.xhtml' : '/sections/search/firstSearchTab.xhtml'}">
</ui:include>
The second one would be including both pages in every tab, but rendering only one using the boolean in the controller. This sounds much worse to me than the first option (it's suggested as an answer in the question I linked before).
Thanks in advance, please feel free to suggest any easier/better way.
::: EDIT :::
Finally did choose to have each tab in a separate xhtml file (being loaded with the c:foreach loop) and in each xhtml/tab all the possible views (also in separate xhtmls) ui:include'd with a rendered clause, hardcoded.
Pretty smooth solution and works great, which possibly would allow to have dynamic contents inside each tab, with another c:foreach loop inside them and a list of pairs in the backing bean which would contain the xhtml names and booleans for rendering (that'd become a bit crazy).
The first option, the view build time conditional one, can lead to problems in some cases. E.g. you won't be able to rely on f:param in the conditional expression.
This sounds much worse to me than the first option
It's not much worse. Creating a bunch of components is not that pricey.
It's not a black and white thing, but my general advice would be to not optimize unless you actually have a performance problem and profiling confirmed that this is the bottleneck (unlikely). Stick to the easiest path, which is using rendered.
For Mojarra you can configure logging like this:
<logger category="javax.enterprise.resource.webcontainer.jsf.timing">
<level name="DEBUG"/>
</logger>
And then you'll see exactly how much time building the view (the Restore View JSF lifecycle phase) takes compared to your logic and rendering (the other phases):
19:47:57,026 DEBUG [timing] (default task-3) [TIMING] - [7ms] :
Execution time for phase (including any PhaseListeners) ->
RESTORE_VIEW 1
...
19:47:57,198 DEBUG [timing] (default task-3)
[TIMING] - [172ms] : Execution time for phase (including any
PhaseListeners) -> RENDER_RESPONSE 6
how to make work rich:datascoller with nested components.
Data table iteration works fine but pagination is not working.
does rich:datascroller works with nested component?
<a4j:repeat >
<rich:datatable id="test">
......
</rich:datatable>
<rich:datascroller for="test"></rich:datascroller>
</a4j:repeat >
any help will be greatly appreciated
Firstly please answer the my question asked in comment section.
About your issue i do not know why you did not add at lease full code of Datatable .
If you read the documentation of the component(Rich_Datascroller) its mentioned below thing
The component should be placed into the footer of the parent table or be bound to it with the "for" attribute. Note, that "for" is
evaluated on view build, not on view render, that is why it will
ignore JSTL tags.
The table should also have the defined "rows" attribute limiting the quantity of inputted table rows.
The scroller could limit the maximum quantity of rendered links on the table pages with the help of the "maxPages" attribute.
So according to above points its look like you missed
The table should also have the defined "rows" attribute limiting the
quantity of inputted table rows.
As per documentation its a mandatory. point to remember . Apart from your issue its good practice before asking in stackoverflow create a simple example and try it out of the box.
About my question I am more interested to know how your code will be work without generating dynamic id as per your code your component id is Static . It should throw the exception because <a4j:repeat> nothing but a for loop.
I have a form which one of it's fields is a code and description, also a button for opening a popup window that contains a list of all of the available codes.
when the user double clickes a row from that table i want to set these values to the code and description. - how can this be done?
Another question, I want to create this popup and table to be initialized dynamically - by that i mean that if i have a few forms in my application, when ever i have a field which has a description i want to be able to open this popup and to see the available list for that field. (every field can be from a diffrent table). is it possible to create something like that? if so, how?
Any help will be appritiated,
Thank's In Advance.
Yes, it is possible. Even more, many component libraries have ready to use popup/dialog components, such as RichFaces with <rich:popupPanel> and PrimeFaces with <p:dialog>.
If you do not want to use a component library for some reason, you would need to create a custom component for this which generates basically an absolutely positioned HTML <div> element with a CSS overlay which get shown/hidden by JS on a particular click/action. The HTML/CSS/JS part should be relatively simple if you are familiar with those languages. The JSF part is somewhat hard if you have never created a custom component before, but it should be possible with a composite component as well, so you could also just create one with pure XHTML. The updating/refreshing can just take place by the usual <f:ajax> means.
Can we sort values in column of a panelGrid. If yes, can I see an example
Rather use h:dataTable to represent a dynamic table which is backed by a List<RowObject>, wherein RowObject is basically just a Javabean (DTO - Data Transfer Obejct, VO - Value Object, whatever you call it :) ) representing a single row.
Such a List can be sorted using Collections#sort(). All you need to do is to implement a Comparator which takes care about the ordering. Then in the JSF page just have a bunch of buttons or links which calls Collections#sort() on the List. Those buttons/links just have to pass the sortfield along.
You can find here a basic example: http://balusc.blogspot.com/2006/06/using-datatables.html#SortingDatatable
No, you can't. <h:panelGrid> = <table>
If you want sorting, look at Richfaces or another component framework (Icefaces, primefaces, trinidad, tomahawk, etc). There are <x:dataTable> components there which allow sorting on their <x:colum>.