Jsf Edit functionality in a datatable - jsf

I have a bean with 5 properties.In which user has to enter the values and save the values.The saved values are displayed in a datatable by ajax functionality.It is working fine.The problem is when i want to edit the record, i have the edit button associated with every row of the table.When edit button is clicked i have to get the record and show the record in editable format above the datatable.What component i have to use to populate the data for editing ? Edit button is also an ajax request.I used panelGrid for that but i did not get them.
could you suggest the right way to solve this one.
Thank you all.........

Use the same datatable for editing.
If you click edit button, store the selected value or index in the backing bean and
render an output component like h:outputText if rowValue != selectedItem
render an input component like h:inputText if rowValue == selectedItem
in your dataTable.
Here is an example:
<h:dataTable value="#{myBean.itemList}" var="item">
<h:column>
<h:outputText value="#{item.someValue}"
rendered="#{item != selectedItem}"/>
<h:inputText value="#{item.someValue}"
rendered="#{item == selectedItem}" />
</h:column>
</h:dataTable>

Related

f:param return null when rendered

I have this code inside dataGrid. When this is rendered f:param return null. If I click on p:selectBooleanCheckbox f:param return the correct ID of particular item in the grid. How can I force f:param to return correct ID when rendered. I need to achieve this: I show user multiple items in dataGrid. I use pagging as well. I want user to be able to select multiple items for comparison table. This all works. The problem is when user goes back and forward in datagrid. p:selectBooleanCheckbox is always unchecked even though user selected this before
<p:selectBooleanCheckbox itemLabel="Compare" value="#{compare.checkCompare}">
<f:param name = "id2" value="#{camp.campID}" />
<p:ajax listener="#{compare.compare()}" />
</p:selectBooleanCheckbox>

JSF datatable/panel display on condition

I have a datatable I display with some value from database etc.
I only want to render the datatable if there is values to display, if not maybe display a message saying there is no values.
I know you can add the datatable to a panelgroup, example:
<h:panelGroup rendered="#{myList > 0}">
Is there a better way of doing this? how would i display the message if the datatable is not rendered?
using jsf 2.2 and richfaces 4.
thanks
You can use opposite conditions for rendering message or result table. For example:
<h:outputText value="No payment receipt to display"
rendered="#{paymentReceiptList.size == 0}"/>
<rich:dataTable id="paymentReceiptTable" var="receipt"
value="#{paymentReceiptList}" rendered="#{paymentReceiptList.size > 0}" >
Or you can display "No result found" info inside rich:dataTable using:
<f:facet name="noData">
<h:outputText value="#{msg.noData}" />
</f:facet>
Or you can display your message inside rich:dataTable using noDataLabel attribute of rich:dataTable.

Datatable selection - inputTextArea doesn't have up-to-date contents

Use case
I have a dialog that contains a datatable and an inputTextArea. The datatable is filled when the user clicks a button. When some (single) row of the datatable is selected, I want the contents of this row to be inserted at the end of the inputTextArea.
Problem
When using the selection attribute of the datatable, I dont have the most recent contents in the inputTextArea. Scenario: I enter "ABC" in my inputTextArea, then click the button, then make my inputTextArea "FFF" and select a row ("dtText") from the datatable. The new contents of the inputTextArea is "ABC dtText" instead of "FFF dtText".
What I tried
I tried to add a new listener but I cannot figure out how to bring it in properly so that it is being called before the selection happens. Found nothing on google or in the PF User Guide.
I was hoping the blur event updates my ruleText, but it doesn't happen.
inputTextArea
<p:inputTextarea value="#{mrBean.selectedElement.ruleTxt}" id="rt1New" rows="20" cols="100" autoResize="false">
<f:ajax event="blur" update="duoDlgForm2" />
</p:inputTextarea>
datatable
<p:dataTable id="qPdt" var="p" value="#{regelBean.queriedParams}" rowKey="#{p}"
selection="#{mrBean.selectedParam}" selectionMode="single">
<p:ajax event="rowSelect" update="#form"/>
<p:column ...
java
public void setSelectedParam(ParamOrDBParamModel selectedParam) {
if(selectedParam != null) {
selectedElement.setRuleTxt(selectedElement.getRuleTxt() + "\n" + selectedParam.getName().trim());
How can I work with the most recent text (selectedElement.getRuleTxt) when I am inside the setSelectedParam method?
PF 4.0
EDIT: if I try jquery, what do I have to insert into my function
$('#qPdt tr').on('click', function() {
// I reach this point, now what? How to get the contents of a row when I know the type?
$("#rt1New").append( ?? )
});

Get id from current row dataTable to link JSF Primefaces Java [duplicate]

This question already has answers here:
How can I pass selected row to commandLink inside dataTable or ui:repeat?
(4 answers)
Closed 6 years ago.
How can i get Id of current Row p:dataTable primefaces to my link where is used this Id? Describe it (sorry for my English). My dataTable looks like on this picture:
http://www.image-share.com/igif-2333-105.html
When i click the button i want to get Id of row where is this button, for example row 1 have id 1, so when button 1 is clicked i must get ID = 1. Show how looks my link where need id:
http://'serverAddress'/myApplication/PDF?type=document&id="+id"
Variable id have type int and getters, setters in entity and bean. Button in JSF looks like below:
h:commandButton value="Print" action="#{printBean.print()}"/>
Method 'Print' initiate my link. Any ideas how to do this? Thanks for help.
You can use p:dataTable's rowIndexVar attribute.
Name of the iterator to refer each row index
Whose iterator name can be used in EL to get the Row Id
For Example:
if rowIndexVar="myId" then you can access each row Index using that iterator name in EL using #{myID}.
Example:
<p:dataTable rowIndexVar="rowId" value="..." var="...">
<p:column>
<h:commandLink action="#{...}">
<f:param name="id" value="#{rowId}" />
</h:commandLink>
</p:column>
</p:dataTable>
Get id in bean
map<String,String> par_map = new HashMap<String,String>(); par_map=FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap();
String id=par_map.get("id");

JSF PrimeFaces inputText inside dataTable

JSF-2.0, Mojarra 2.1.19, PrimeFaces 3.4.1
Summary of the problem: Have a p:inputText inside p:dataTable and inputText action fired by p:remoteCommand which passes the dataTable row index as a parameter with f:setPropertyActionListener. But it always passes the last row of the dataTable, not the index of the row which includes currently clicked p:inputText.
As it can be seen from my previous questions, I am trying to use p:inputText as a comment taker for a status like in Facebook or etc. Implementation includes a p:dataTable. It's rows represents each status. Seems like:
<p:dataTable id="dataTable" value="#{statusBean.statusList}" var="status"
rowIndexVar="indexStatusList">
<p:column>
<p:panel id="statusRepeatPanel">
<p:remoteCommand name="test" action="#{statusBean.insertComment}"
update="statusRepeatPanel">
<f:setPropertyActionListener
target="#{statusBean.indexStatusList}"
value="#{indexStatusList}">
</f:setPropertyActionListener>
</p:remoteCommand>
<p:inputText id="commentInput" value="#{statusBean.newComment}"
onkeypress="if (event.keyCode == 13) { test(); return false; }">
</p:inputText>
</p:panel>
</p:column>
</p:dataTable>
Upper code says when the press enter key, fire p:remoteCommand which calls the insert method of the managed bean.
#ManagedBean
#ViewScoped
public class StatusBean {
List<Status> statusList = new ArrayList<Status>();
public int indexStatusList;
public String newComment
//getters and setters
public void insertComment() {
long statusID = findStatusID(statusList.get(indexStatusList));
statusDao.insert(this.newComment,statusID)
}
Let's debug together; assuming there are three statuses shown in the p:dataTable, click in the p:inputText which in the second status(index of 1), type "relax" and press the enter key.
In the debug console, it correctly shows "relax", but it finds the wrong status because indexStatusList has the value of 2 which belongs the last status in the p:statusList. It must be 1 which is the index of p:inputText that clicked on the dataTable row.
I think problem is about p:remoteCommand which takes the last index on the screen.
How it works?
Let's imagine there is a p:commandLink instead of p:remoteCommand and p:inputText:
<p:commandLink action=#{statusBean.insertComment>
<f:setPropertyActionListener target="#{statusBean.indexStatusList}"
value="#{indexStatusList}"></f:setPropertyActionListener>
This component successfully passes the indexStatusList as currently clicked one.
Conceptual problem in this solution lies in way how p:remoteCommand works. It creates JavaScript function whose name is defined in name attribute of p:remoteCommand. As you putted this in dataTable it will iterate and create JavaScript function called test as many times as there is rows in this table, and at the end last one will be only one. So, solution can be in appending index at the name of the remoteCommand but that is bad, because you will have many unnecessary JavaScript functions. Better approach would be to create one function an pass argument to it. So define remoteCommand outside of datatable:
<p:remoteCommand name="test" action="#{statusBean.insertComment}" update="statusRepeatPanel">
and call test function like this in your onkeypress event:
test([{ name: 'rowNumber', value: #{indexStatusList} }])
This will pass rowNumber parameter in your AJAX request. In backing bean's insertComment() method you can read this parameter and do with it anything you want:
FacesContext context = FacesContext.getCurrentInstance();
Map map = context.getExternalContext().getRequestParameterMap();
Integer rowNumber = Integer.parseInt(map.get("rowNumber").toString());
NOTE: as you are updating panel in each row, maybe you can change update attribute of remoteCommand to #parent so this will work for all rows.
EDIT: You can update the specific panel in specific row with following code in Java method:
RequestContext.getCurrentinstance().update("form:dataTable:" + rowNumber + ":statusRepeatPanel")

Resources