how can i use “ajax-event rowDblselect” for nested datatable

1
votes

i have a datatable listing submerchants. Also i have a child datatable listing the services of the submerchants. I use "p:rowExpansion" to show services datatable. I need to show submerchant details when the user double clicks the parent datatable row(submerchant). Also, i need to show service details when the user double clicks the services datatble row. It works fine if i use p:ajax event=rowDblselect for submerchant table and ajax event=rowSelect for services table. But it fails if i use ajax event=rowDblselect for both datatable that what i want to do. My code looks like as below;

     <p:dataTable id="subMerchantsDataTable" var="subM"
             value="#{subMerchantManagement.subMerchantList}"
             rowKey="#{subM.subMerchantId}"
             selection="#{subMerchantCommon.selectedSubMerchant}"
             selectionMode="single"
             style="width:1000;border: 1px solid rgb(168, 168, 168);"
             scrollRows="20" scrollable="true" liveScroll="true"
             scrollHeight="450"
             emptyMessage="#{messagebundle.submerc_grdlabel_no_submerchant}">

           <p:ajax event="rowToggle"
              listener="#{subMerchantManagement.onRowToggle}" width="100%" />

           <p:ajax event="rowDblselect"
              listener="#{subMerchantManagement.retrieveSubmerchantDetails}"
              update=":mainTabView"  />

           <p:column width="20" disabledSelection="true">
              <p:rowToggler />
           </p:column>

           <p:column headerText="#{messagebundle.submerc_columnHeader_id}"
              width="70" sortBy="#{subM.subMerchantId}">
              <h:outputText value="#{subM.subMerchantId}" />
           </p:column>
           ...........
           ...........
           <p:rowExpansion>
              <p:dataTable id="subMerchantServicesDataTable" var="svc"
                 value="#{subM.subMerchantServices}" rowKey="#{svc.serviceId}"
                 selection="#{subMerchantCommon.selectedService}"
                 selectionMode="single"
                 style="border: 1px solid rgb(168, 168, 168);" 
                 emptyMessage="#{messagebundle.submerc_grdlabel_no_service}">

                 <p:ajax event="rowSelect"
                    listener="#{subMerchantManagement.retrieveSubmerchantDetailsByService}"
                    update=":mainTabView" />

                 <p:column width="18">
                    <h:outputText value="-" />
                 </p:column>
                 <p:column width="70">
                    <h:outputText value="#{svc.serviceId}" />
                 </p:column>
                    ...........
                    ...........
              </p:dataTable>
         </p:rowExpansion>
   </p:dataTable>

When i use ajax event=rowDblselect for both datatable. if i double click the services datatable row, the detail page is shown but the exception is occured that i catch from the console as below;

`WARNING: Method not found: ........faces.bean.submerchants.SubMerchantManagement@1b0c025.retrieveSubmerchantDetailsByService(javax.faces.event.AjaxBehaviorEvent)
javax.el.MethodNotFoundException: Method not found: .........faces.bean.submerchants.SubMerchantManagement@1b0c025.retrieveSubmerchantDetailsByService(javax.faces.event.AjaxBehaviorEvent)
at com.sun.el.util.ReflectionUtil.getMethod(ReflectionUtil.java:155)
at com.sun.el.parser.AstValue.invoke(AstValue.java:231)
at com.sun.el.MethodExpressionImpl.invoke(MethodExpressionImpl.java:297)
at org.primefaces.component.behavior.ajax.AjaxBehaviorListenerImpl.processAjaxBehavior(AjaxBehaviorListenerImpl.java:47)
at javax.faces.event.AjaxBehaviorEvent.processListener(AjaxBehaviorEvent.java:113)
at javax.faces.component.behavior.BehaviorBase.broadcast(BehaviorBase.java:106)
at javax.faces.component.UIComponentBase.broadcast(UIComponentBase.java:760)
at javax.faces.component.UIData.broadcast(UIData.java:1071)
at javax.faces.component.UIData.broadcast(UIData.java:1093)
at javax.faces.component.UIData.broadcast(UIData.java:1093)
at javax.faces.component.UIData.broadcast(UIData.java:1093)
at javax.faces.component.UIViewRoot.broadcastEvents(UIViewRoot.java:794)
at javax.faces.component.UIViewRoot.processApplication(UIViewRoot.java:1259)
at com.sun.faces.lifecycle.InvokeApplicationPhase.execute(InvokeApplicationPhase.java:81)
at com.sun.faces.lifecycle.Phase.doPhase(Phase.java:101)
at com.sun.faces.lifecycle.LifecycleImpl.execute(LifecycleImpl.java:118)
at javax.faces.webapp.FacesServlet.service(FacesServlet.java:593)
at weblogic.servlet.internal.StubSecurityHelper$ServletServiceAction.run(StubSecurityHelper.java:227)
at weblogic.servlet.internal.StubSecurityHelper.invokeServlet(StubSecurityHelper.java:125)
at weblogic.servlet.internal.ServletStubImpl.execute(ServletStubImpl.java:300)
at weblogic.servlet.internal.TailFilter.doFilter(TailFilter.java:26)
at weblogic.servlet.internal.FilterChainImpl.doFilter(FilterChainImpl.java:56)
at org.primefaces.webapp.filter.FileUploadFilter.doFilter(FileUploadFilter.java:79)
at weblogic.servlet.internal.FilterChainImpl.doFilter(FilterChainImpl.java:56)
at weblogic.servlet.internal.RequestEventsFilter.doFilter(RequestEventsFilter.java:27)
at weblogic.servlet.internal.FilterChainImpl.doFilter(FilterChainImpl.java:56)
at weblogic.servlet.internal.WebAppServletContext$ServletInvocationAction.wrapRun(WebAppServletContext.java:3715)
at weblogic.servlet.internal.WebAppServletContext$ServletInvocationAction.run(WebAppServletContext.java:3681)
at weblogic.security.acl.internal.AuthenticatedSubject.doAs(AuthenticatedSubject.java:321)
at weblogic.security.service.SecurityManager.runAs(SecurityManager.java:120)
at weblogic.servlet.internal.WebAppServletContext.securedExecute(WebAppServletContext.java:2277)
at weblogic.servlet.internal.WebAppServletContext.execute(WebAppServletContext.java:2183)
at weblogic.servlet.internal.ServletRequestImpl.run(ServletRequestImpl.java:1454)
at weblogic.work.ExecuteThread.execute(ExecuteThread.java:209)
at weblogic.work.ExecuteThread.run(ExecuteThread.java:178)`

if i double click the submerchants datatable row, the detail page can not be shown (the managed bean method cannot be called.) and the same exception is occured that i catch from the console. It looks that when i double click the services datatable row, the method related to submerchants datatable is called and the same exception is thrown again.

Is there anyone have an idea for solution? Any advice will be appreciated. I wanna just nested datatables and wanna navigate to details when i click the rows for each datatble. Thanks in advance....

2
javajsfjakarta-eeweb-applicationsprimefaces
it seems that even i click(double) the services datatable row, the method related to submerchants datatable is called. And the same exception is thrown again. I couldn't undertstand why 'retrieveSubmerchantDetailsByService(javax.faces.event.AjaxBehaviorEvent)' signature is searched. I write managed bean methods with "SelectEvent event" parameter like in the showcase. – ttakci
Do the datatables work when not nested? – siebz0r
Hey siebz0r, i added an additional submerchant datatable in the same panelgrid. At least, doubleselect-ajax event works for both seperate datatables. But, there was a different problem that the selectedRow data appears null for one of those datatables. Actually, i just copy the submerchant datatable code. – ttakci
Btw, actually i need to nested datatable and wanna go to detail pages with double clicking for each datatable. My managed beans functionalitiy is fine, i can use rowDblselect for outer datable and use rowSelect for inner datatable. Everything works fine if i dont use rowDblselect event for both outer and inner datables. Is there a bug? – ttakci

2 Answers

1
votes

Try using rowDblselect for one of the dataTables and manually listening and triggering dblClick event through jQuery for the other dataTable

0
votes

I did a quick test and it turns out I have the same result. When a p:datatable has another p:datatable nested with the same events bound to it, it's duplicated events won't work as you would expect.

I also noticed that if you remove the listener attribute from the p:ajax tag it basically 'works'.

Another problem then is that the selected value gets overwritten with a null value for some reason. A 'workaround' would be to check in the setter of the selection value if it isn't null. However these are all dirty workarounds and a bug should be reported, ;-)

Working example:

Bean (should be at least view scoped):

public class Bean
{
    private List<String> firstList = new ArrayList<String>();
    private List<String> secondList = new ArrayList<String>();
    private String selection;

    @PostConstruct
    private void init()
    {
        firstList.add("First item");
        firstList.add("Second item");
        secondList.add("Third item");
        secondList.add("Fourth item");
    }

    public void setSelection(String selection)
    {
        if (selection != null && !selection.isEmpty())
        this.selection = selection;
    }

    // Other getters/setters omitted
}

JSF:

<h:form>
    <p:dataTable value="#{bean.firstList}" var="first" rowKey="#{first}"
        selection="#{bean.selection}" selectionMode="single">
        <p:ajax event="rowSelect" update=":selectionPanel" />
        <p:column>
            <p:rowToggler />
        </p:column>
        <p:column>
            <h:outputText value="#{first}" />
        </p:column>
        <p:rowExpansion>
            <p:dataTable value="#{bean.secondList}" var="second"
                rowKey="#{second}" selection="#{bean.selection}"
                selectionMode="single">
                <p:ajax event="rowSelect" update=":selectionPanel" />
                <p:column>
                    <h:outputText value="#{second}" />
                </p:column>
            </p:dataTable>
        </p:rowExpansion>
    </p:dataTable>
</h:form>
<p:panel id="selectionPanel" header="Selection">
    <h:outputText value="#{bean.selection}" />
</p:panel>