In a Richfaces Datatable with clickable rows, I want one column to ignore the onClickEvent

217 Views Asked by At

In an application based on Seam 2.2.1, JSF 1.2, Richfaces 3.3.3, I have a datatable with clickable rows. In the last column, I have an icon (trash). Clicking here should execute a different method (delete). The standard onRowClick event should not apply.

Is there any easy way to accomplish this?

<rich:panel headerClass="panelHeader" styleClass="panel">
    <f:facet name="header">Header</f:facet>
    <rich:dataTable id="myTable" value="#{myModel}" var="k">

        <a4j:support event="onRowClick" action="#{myAction.selectItem(k, facesContext.viewRoot.viewId)}"
                            reRender="myTable"/>

            <rich:column>
                <f:facet name="header">
                        <h:outputText value="Normal Column - should be clickable"/>
                </f:facet>
                <h:outputText value="#{k.name}"/>
            </rich:column>

            <rich:column >
                <f:facet name="header">
                    <h:outputText value="Only Click on Icon should react to Mouseclick"/>
                </f:facet>
                <s:graphicImage value="/img/bin_closed.gif">
                    <a4j:support event="onclick"
                                 action="#{myAction.deleteItem(k)}"
                                 reRender="myTable"
                                 ajaxSingle="true" limitToList="true"
                                 onsubmit="if(!confirm('Really?')) { return false; }" />/>
                </s:graphicImage>
            </rich:column>

    </rich:dataTable>

</rich:panel>
1

There are 1 best solutions below

0
Robert On

I found the solution to my problem. For the column that contains the icon, I put the icon into another <a4j:outputPanel element like this: `

Now, only the action method is executed when clicking on the icon.

Here is the full solution:

<rich:panel headerClass="panelHeader" styleClass="panel">
    <f:facet name="header">Header</f:facet>
    <rich:dataTable id="myTable" value="#{myModel}" var="k">

        <a4j:support event="onRowClick" action="#{myAction.selectItem(k, facesContext.viewRoot.viewId)}"
                            reRender="myTable"/>

            <rich:column>
                <f:facet name="header">
                        <h:outputText value="Normal Column - should be clickable"/>
                </f:facet>
                <h:outputText value="#{k.name}"/>
            </rich:column>

            <rich:column >
                <f:facet name="header">
                    <h:outputText value="Only Click on Icon should react to Mouseclick"/>
                </f:facet>
                <a4j:outputPanel onclick="event.stopPropagation()">
                    <s:graphicImage value="/img/bin_closed.gif">
                        <a4j:support event="onclick"
                                     action="#{myAction.deleteItem(k)}"
                                     ajaxSingle="true" limitToList="true"
                                     onsubmit="if(!confirm('Really?')) { return false; }" />/>
                    </s:graphicImage>
                </a4j:outputPanel>
            </rich:column>

    </rich:dataTable>

</rich:panel>