I have a dataTable and in a column a filterBy parameter.
When I type something on the filter box, it indeed filters the table but when I delete or change what I wrote on that field nothing happens and every other action in the page is blocked.
I mean, after that if I click on a button nothing happens, no event-action is performed.
I'm using JSF 2.1, on Tomcat 7, with EE5.
What are your suggestions? Thanks a lot in advance.
XHTML code fragment:
<p:dataTable value="#{consolidacionAslBean.listaMunicipios}"
rowKey="#{municipio}" var="municipio" paginator="true"
rows="5" id="tableMunicipio"
selection="#{consolidacionAslBean.municipios}" style="font-size: 13px"
filteredValue="#{consolidacionAslBean.filteredMunicipios}"
>
<p:column
filterBy="#{municipio.catMunicipios.id.cdgMunicipio}"
headerText="Clave">
<h:outputText value="#{municipio.catMunicipios.id.cdgMunicipio}" />
</p:column>
And bean the proper objects:
private List<AslMunicipios> filteredMunicipios;
private List<AslMunicipios> listaMunicipios;
Thanks!
Related
I got the following problem using Primefaces 5.2 and JSF 2.1
I got a p:dataTable, and when the user selects a row, the selected object's data should be shown below the table. One requirement is that there should be a checkbox below the table, which should be editable. If the user toggles the checkbox and selects a different entry in the table, the checkbox' new value should be saved. (see the code below)
But I observed the following behaviour. When I select object1, check its checkbox and then select object2, object2's setter will be called, not object1's. Thus object2.someValue will be changed, while object1.someValue won't be. any idea?
<p:dataTable var="myVar" selectionMode="single"
id="myTable" selection="#{form.myValue}"
rowKey="#{myVar.id}"
value="#{form.myTableData}">
<!-- columns here -->
<p:ajax event="rowSelect" process="my_booleancheckbox" update="wrapper">
<p:dataTable>
<h:panelGroup id="wrapper">
<p:booleanCheckbox value="#{form.myValue.someValue}" id="my_booleancheckbox"/>
<!--other stuff here -->
</h:panelGroup>
That's how it is supposed to work, the rowSelect event is fired after the property selection of your p:dataTable is updated
move your ajax action to the p:booleanCheckbox
<p:dataTable var="myVar" selectionMode="single"
id="myTable" selection="#{form.myValue}"
rowKey="#{myVar.id}"
value="#{form.myTableData}">
<!-- columns here -->
<p:dataTable>
<h:panelGroup id="wrapper">
<p:booleanCheckbox value="#{form.myValue.someValue}" id="my_booleancheckbox">
<p:ajax process="my_booleancheckbox" update="wrapper">
</p:booleanCheckbox>
<!--other stuff here -->
</h:panelGroup>
I have the next structure in my xhtml
<p:panel>
<p:acordeonPanel>
<p:tab>
<h:form>
<table>
<tr>td><commandButton action="#{myBean.searchAnimals}"update=":form:partidos" ></td></tr>
</table>
</h:form>
</p:tab>
</p:acordeonPanel>
</p:panel>
<p:panel>
<h:form id="form">
<p:dataTable id="partidos" value="#{myBean.foundAnimals}">
</h:form>
....
The method searchAnimals() it´s OK, it returns the Animal items, but the dataTable doesn't refresh, but in the java code (managedBean) the ArrayList contains the items.
What can i do? Thanks
EDIT:
I have de h: and the p: suffix correctly (i think so), the code is part of the complete code but is the fragment that doesn't work correctly. In the first panel i have a filter controls (by category, by date, etc.) and the function of the command button is call a function that execute a query on the database, this function is well because it's filling the ArrayList with the resultset (myBean.foundAnimals) but these items doens't refresh on the view (dataTable) :(
You should use an <h:form> for both and set the render value from your commandButton to rendered=":form" to achieve rerendering the form after clicking the commandButton.
I'm having a problem with the dataTable multiple selection with checkbox (like the second one: http://primefaces.org/showcase/ui/datatableRowSelectionRadioCheckbox.jsf).
When I try to execute a method in my backingBean, the selected items always comes with the right size, but, with the same object.
Example: I select in my dataTable three Messages: Message 1, Message 2 and Message 3. When I execute my method in the JSF page my selected items comes like this:
Messages[0] = Message 1
Messages[1] = Message 1
Messages[2] = Message 1
Here is my JSF Page:
<p:dataTable id="mensagensLidas" var="msg" value="#{mensagensBean.msgGrupoModel}"
paginator="true" rows="10" selection="#{mensagensBean.selectedMsgsGrupo}">
<p:column selectionMode="multiple" style="width:2%"/>
<p:column headerText="Titulo:" style="width:49%">
#{msg.titulo}
</p:column>
<f:facet name="footer">
<p:commandButton id="multiViewButton" value="#{msgs.delete}" icon="ui-icon-trash" actionListener="#{mensagensBean.excluirMsgsGrupo}" update=":tabMain" ajax="true"/>
</f:facet>
</p:dataTable>
Your above code is working fine for me except that I'm using a rowKey.
Try using rowKey attribute in p:dataTable
<p:dataTable id="mensagensLidas" var="msg" value="#{mensagensBean.msgGrupoModel}"
paginator="true" rows="10" selection="#{mensagensBean.selectedMsgsGrupo}"
rowKey="#{msg.titulo}">
....
</p:dataTable>
Using rowKey is must and best practice when you have selection in Datables, it helps to map the selected <tr> to the POJOs that you're filling up with.
Usually its even better if your rowKey is unique propety, you can even put an integer variable in your #{msg} POJO as best practice.
I discovered the problem. My DataModel was with the getRowData returning always the same object. I was doing a wrong comparison. Thank you all!
I am working on a form which has two datatables. In the first datatable, I am displaying the radio buttons and checkboxes, whereas the second datatable contains
selectOneMenu(s). Value change listener has been implemented on the selectOneMenu and on value change, the subsequent fields gets populated based on the selection.
Everything works fine except that when I select the value from the dropdown, the checkbox and the radio button values are cleared.
f:ajax event="change" has been used for the change event on selectOneMenu. Looks like the whole page gets refreshed and the values are cleared.
I also tried using f:ajax by updating the id of the datatable in which the selectOneMenu is present.
<p:dataTable styleClass="borderless" id="inResultTable" var="result" value="#{RequestBean.fooFields}" rendered="#{not empty RequestBean.fooFields}">
<p:column style="width:150px;">
<f:facet name="header">
<h:outputText value=" " />
</f:facet>
<h:outputText value="#{msg[result.fldLabel]}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="" />
</f:facet>
<ui:repeat value="#{RequestBean.fooFields}"
var="itm">
<h:selectOneMenu value="#{itm.indFieldValue}"
rendered="#{result.lvlid==itm.lvlid}"
style="width:250px;padding-right:150px;text-align: left;">
<f:selectItems value="#{RequestBean[itm.indField]}" />
</h:selectOneMenu>
<h:selectOneRadio value="#{itm.indFieldValue}" rendered="#{result.lvlid==itm.lvlid and result.fldType=='radio'}"
style="width:250px;padding-right:150px;text-align: left;">
<f:selectItems value="#{RequestBean[itm.indField]}" />
</h:selectOneRadio>
<h:selectManyCheckbox value="#{itm.indFieldCheckBox}" rendered="#{result.lvlid==itm.lvlid and result.fldType=='selectbox'}">
<f:selectItems value="#{RequestBean[itm.indField]}" />
</h:selectManyCheckbox>
</ui:repeat>
</p:column>
</p:dataTable>
<p:dataTable styleClass="borderless"
id="resultTable" var="result"
value="#{RequestBean.depFields}">
<h:selectOneMenu value="#{RequestBean.field4Value}"
valueChangeListener="#{RequestBean.processValueChange4}"
rendered="#{result.lvlid=='5' and result.fldType=='selectbox'}"
style="width:250px;padding-right:150px;text-align: left;">
<f:selectItem itemLabel="--Please Select--" itemValue="#{null}" />
<f:selectItems value="#{RequestBean[result.field]}" />
<f:ajax event="change" render="#form" />
</h:selectOneMenu>
...
...
</p:dataTable>
N.B: The requirement is such that the datatable with checkbox and radio buttons has to be placed at the top. IDs cannot be used for the selectOneMenu in the second table since I am
populating the selecOneMenu(s) dynamically based upon the entries in the database.
I know that this might be a simple issue but didn't have any luck with the info posted on most websites.
Any help would be appreciated.
Here's your <f:ajax>.
<f:ajax event="change" render="#form" />
You didn't specify the process attribute. So it defaults to #this, which means that only the current input component is processed during submit. However, you specified a render of the whole form. So the whole form will be refreshed. However, the other input components aren't been processed during submit. So their model values won't be updated, which means that during render response the initial values will be redisplayed instead of the submitted values, which are in your case apparently blank/null.
You've basically 2 options:
Process the whole form during submit.
<f:ajax process="#form" render="#form" />
Or, update only those components which really needs to be updated.
<f:ajax render="clientId1 clientId2 clientId3" />
In your particular case I think option 2 isn't viable, so option 1 is the best one. Please note that I omitted the event attribute. It defaults to change already.
Unrelated to the concrete problem, I'm not sure what you're all doing in your value change listener method, but I only want to note that most starters abuse it for the purpose of manipulating the model values and that it don't always work quite as expected (changed model values are not reflected at all). If this is true in your case, then you should actually be using <f:ajax listener> instead.
See also:
When to use valueChangeListener or f:ajax listener?
The main reason for the values of Check boxes & Radio buttons getting cleared after a value change listener could be that the model values are not updated.
Value change listeners are called before updating the model.
For these kind of issues, it is very important to have an understanding of the JSF lifecycle.
Please try following code in your value change listener and see.
public void valueChange(ValueChangeEvent event){
PhaseId phase = event.getPhaseId();
if (phase.equals(PhaseId.ANY_PHASE))
{
event.setPhaseId(PhaseId.UPDATE_MODEL_VALUES);
event.queue();
return;
}
if(!phase.equals(PhaseId.UPDATE_MODEL_VALUES))
{
return;
}
// Your code
}
I didn't try this code with your example. Please let me know with complete example source code if it is not working.
Thanks.
I have a primefaces datatable and inside the primefaces datatable, I have a column, which contains the . The issue is,I have set the default value for the as false. When I click/check the , its still retrieving the value as false. I tried it multiple times but not sure why its returning false. Please find the sample code below.
<p:dataTable id="review-table" var="item" value="#{demandBean.filterVOList}">
<p:column id="SelectallID" style="text-align: left; width:40px;" rendered="#{demandBean.screeRenderVo.selectAllRenderer}">
<f:facet name="header" >
<h:outputText id="selectId" value="#{demandBean.dmdScreenLabelVO.selectAll}" />
<div></div>
<h:selectBooleanCheckbox id="checkbox1" value="Select All" onclick="checkAll(this)"/>
</f:facet>
<h:selectBooleanCheckbox id="checkbox2" value="#{item.selected}"/>
</p:column>
Im getting the value as false, when I check the and click on the save button. I have written an Action listerner, below is the code corresponding to the actionListener
public void saveData(ActionEvent event)
{
System.out.println("Entering the Save :");
selected = isSelected();
System.out.println("value of Selected"+selected);
}
I have tried debugging the code as well, but not sure why the value for is getting displayed as false. Please Assist. Thanks in Advance
You seem to be binding the value of all checkboxes in the column to the one and same bean property. This way the value will ultimately end up to be the one of the last row in the column.
This is not how it's supposed to be used.
You basically need to bind the value of the checkbox to the property of the currently iterated row object (the one behind the var attribute of the datatable).
<p:dataTable value="#{bean.items}" var="item">
<p:column>
<p:selectBooleanCheckbox value="#{item.selected}" />
Alternatively, you could use the <p:column selectionMode="multiple" /> to use builtin multiple selection support of the PrimeFaces datatable (see also the showcase example).
<p:dataTable value="#{bean.items}" var="item" rowKey="#{item.id}" selection="#{bean.selectedItems}">
<p:column selectionMode="multiple" />