p:dataTable modify drop down filter on selection of other filter

Question

I'm using primefaces datatable with filters. In filters I have two drop down select box. I want to modify second drop down box after selecting first.

Here is my code:

<p:dataTable id="stockTable1" widgetVar="stockTable" var="stock" value="#{stockBean.stockList}" filteredValue="#{stockBean.filteredStocks}" paginator="true" rows="10" 
             paginatorTemplate="{RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}"
             rowsPerPageTemplate="5,10,20, 50">
    <p:column headerText="Product Id" sortBy="#{stock.name}" filterBy="#{stock.name}">
        <h:outputText value="#{stock.name}" />
    </p:column>
    <p:column headerText="Category" sortBy="#{stock.categoryId}" filterBy="#{stock.categoryId}" filterMatchMode="exact">
        <f:facet name="filter">
            <p:selectOneMenu onchange="PF('stockTable').filter()" value="#{stockBean.selectedCategory}">
                <f:selectItem itemLabel="Select One" itemValue="#{null}" noSelectionOption="true" />
                <f:selectItems value="#{stockBean.categoryNames}" />
            </p:selectOneMenu>
        </f:facet>
        <h:outputText value="#{stock.categoryId}" />
    </p:column>
    <p:column headerText="Sub Category" sortBy="#{stock.subCategoryId}" filterBy="#{stock.subCategoryId}" filterMatchMode="exact" >
        <f:facet name="filter">
            <p:selectOneMenu onchange="PF('stockTable').filter()" immediate="true" id="subChange">
                <f:selectItem itemLabel="Select One" itemValue="#{null}" noSelectionOption="true" />
                <f:selectItems value="#{stockBean.subcategoryNames}" />
            </p:selectOneMenu>
        </f:facet>
        <h:outputText id="stockDescription" value="#{stock.subCategoryId}" />
    </p:column>
    <p:column headerText="Last Updated" sortBy="#{stock.updatedTS}" >
        <h:outputText value="#{stock.updatedTS}" >
            <f:convertDateTime pattern="dd/MM/yyyy HH:mm:ss"/>
        </h:outputText>
    </p:column>
</p:dataTable>

I want to modify subcategory dropdown box after selection of category.

Smutje Smutje · Accepted Answer · 2016-02-16T11:17:30

You could attach a p:ajax event to the first p:selectOneMenu:

<p:selectOneMenu onchange="PF('stockTable').filter()"
                 value="#{stockBean.selectedCategory}">

<!-- ... -->

    <p:ajax event="change" 
            process="stockTable1"
            update="stockTable1"
            partialSubmit="true"
            listener="#{stockBean.changeSubcategoryNames}"/>

where you could adjust the values of subChange inside of the new method stockBean.changeSubcategoryNames for example.

p:dataTable modify drop down filter on selection of other filter

1 Answers