Expanding only one row in PrimeFaces DataTable

Question

I am implementing a datatable and would like to limit the user to only be allowed to expand one datatable row at a time. If a user goes to expand a second row when another row is already expanded it will collapse the first row before expanding the second. Is this possible using primefaces? I am currently using Primefaces Version 3.0

While looking at the documentation there does not seem to be much in the way of customization included with these components, so I was not really sure of where to even start. — dpranker
Are you in a position where you can upgrade your PrimeFaces version to the latest version? (i.e. not just 3.0 but instead upgrade to 3.3.1)? (If so, I have a solution for you..) — BestPractices
That may be a possibility if its something that would not work with the older version — dpranker
possible duplicate of How at a time one row can expand in <p:dataTable>? — Jasper de Vries

BestPractices BestPractices · Accepted Answer · 2012-07-03T18:22:49

PrimeFaces is just about to release an enhancement that adds a "rowToggle" event to their row expansion component. It should be in the next release after 3.3.1. It will allow you to handle the row toggle event. Once you have the ability to handle the toggle event, you will be able to write code that will collapse all rows other than the current toggled row. See here: https://code.google.com/p/primefaces/issues/detail?id=2277 which states that it will be included in the next deployment.

Note that they've already added an example of this new event to their showcase labs: http://www.primefaces.org/showcase-labs/ui/datatableExpandableRows.jsf, so it should be forthcoming.

Alternatively, you can leverage the "onExpandStart" attribute of <p:dataTable> to invoke client side code (Javascript) to collapse any rows which are in an expanded state.

Expanding only one row in PrimeFaces DataTable

1 Answers