CODEWITHSUNDEEP
jsf-2primefaces
Gowtham
Gowtham

Reputation: 1507

Primefaces Datatable filter values are lost after the datatable is refreshed

I am using JSF 2.0 and Primefaces 3.2. I have a main form with a datatable and a button on each row that brings up a dialog with another data table. The dialog has its own form. When the datatable row is selected in the dialog, i process the selection and then refresh the datatable in the main form. After the refresh all my filters on the main datatable are lost. Is there a way to remember the filter values?

My JSF page

<h:panelGroup id="mainTable">
<h:form id="mainForm" prependId="false">                
<p:dataTable id="cl_grid1" var="item"    widgetVar="mainGrid"
                value="# {controller.items}">


<p:column headerText="Colum1" filterMatchMode="contains" filterBy="#{item.myObj.code}" sortBy="#{item.myObj.code}">
                        <h:outputText value="#{item.myObj.code}" style="float:left" />

                        <p:commandButton id="selectBtn" icon="select"
                            oncomplete="selectDialog.show()" actionListener="#{controller.setMainItem}">
                            <f:param name="selectedMainItem" value="#{item.id}"/>
                        </p:commandButton>



                </p:column>

</p:dataTable
</h:form>
</h:panelGroup>

<p:dialog id="cl_selectDialog" header="Select AAAA" dynamic="true" modal="true" widgetVar="selectDialog" 
    height="500" width="900" showEffect="explode" hideEffect="explode">

        <h:form id="selectForm" prependId="true">

            <p:dataTable id="cl_selectGrid" var="selectorItem"    widgetVar="selectGrid"
                value="# {controller.selectorItems}" selection="#{controller.selectedItem}" 
rowKey="#{selectorItem.id}" selectionMode="single">



            <p:commandButton actionListener="#{controller.processSelection}" value="Ok" icon="ui-icon ui-icon-search" 
                                    oncomplete="selectDialog.hide()" update=":mainTable" process="@form"/>
            <p:commandButton value="Cancel" icon="ui-icon ui-icon-search" onclick="selectDialog.hide()" type="button"/>
        </h:form>
    </p:dialog>

My Controller

In my controller all i am doing is hydrating my datatable again.

@Component
@Scope("view")
public class Controller extends BaseController implements Serializable {

private List<Item> items;

public Controller() {
    items = new ArrayList<Item>();  
}


@PostConstruct
public void init() {
    loadItems();
}

protected void loadItems() {
    items = //Load items from Database
}


public void processSelection(ActionEvent event) {
    //Add the selected Item and then reload items
    loadItems();
}

}

Upvotes: 12

Views: 31416

Answers (3)

Daniel
Daniel

Reputation: 37061

Since you must to refresh the table from within its form (so it will preserve the filter state) another solution could be to place a hidden button in the main table form and use it as a 'proxy' by clicking it from your dialog, that way the filter will be preserved, like this

change your button from 

 <p:commandButton actionListener="#{controller.processSelection}" value="Ok" icon="ui-icon ui-icon-search" 
     oncomplete="selectDialog.hide()" update=":mainTable" process="@form"/>

into this (just a simple button that clicks the hidden one)

 <p:commandButton onclick="$('#my-proxy-button-id').click(); return false;" value="Ok" icon="ui-icon ui-icon-search"/>

and add a new button inside the main table form

 <p:commandButton style="display:none;" id="my-proxy-button-id" actionListener="#{controller.processSelection}" 
     oncomplete="selectDialog.hide()" update="mainTable" process=":selectForm"/>

using this technique you wont be needed to call for filtering manually and no additional "blinking" will appear on screen

Upvotes: 1

Melloware
Melloware

Reputation: 12029

We also came up with a slightly more elegant solution than the one posted by kolossus which is as simple as extending the PF Datatable for persistent filter values.

http://www.stickysession.com/?p=258

Upvotes: 2

S&#233;bastien Vanmechelen
S&#233;bastien Vanmechelen

Reputation: 574

If it is an AJAX Request, you can add on your trigger component a 'oncomplete' method which has :

<p: ... update='myDatatableId' oncomplete='myDatatableWidget.filter();' />

By this way you will re-triggering current filters on the datatable or you can also clear all filters by using

 ... oncomplete='myDatatableWidget.clearFilters();' ...

Upvotes: 16

Related Questions