Closed ghost closed 5 years ago
Actually, I wasn't even aware we've already implemented expandable rows. I'd guess it's still in our list of open issues. Did you implement the feature yourself?
No. This is what I meant by expandable rows.
I feel stupid - the demo rings a bell, it's a screenshot from our showcase, but still, I don't find it. Can you help me?
Nonetheless, I can help you with the buttons you've added to the datatable. Just add an return false;
to the onclick
handler of the button. Strictly speaking, it should be preceded with an javaScript:
prefix, but the simple and intuitive version seems to do the trick just as well:
<b:dataTableColumn>
<b:commandButton value="edit" icon="edit" ajax="true" update="@(.editableCarTable)"
onclick="ajax:car.edit(); return false;" > <!-- <<<< add the return statement here -->
</b:commandButton>
</b:dataTableColumn>
https://showcase.bootsfaces.net/forms/DataTable.jsf The example table under the section 'Responsiveness' loads like this in mobile devices.
And for the button onclick, I tried your fix, it is not working in my application.
<b:dataTableColumn>
<b:commandButton ajax="true" onclick="ajax:bean.delete(var.id);javascript:return false;" update="@(.table)">
<h:graphicImage library="folder" name="imageName.abc"/>
</b:commandButton>
</b:dataTableColumn>
Ah, that's why I didn't find the demo! The expand/collapse buttons are added automatically by the JavaScript component, so I'm afraid there's little we can do about it. But I'll have a look nonetheless.
Concerning the buttons: strange, it did work when I tested it. Maybe you have to call event.preventDefault()
instead of return false
.
Ah, this only happens if the commandButton is in the first column. Put it in the second column, and you won't have any conflicts.
After looking at the implementation, I have little hope to solve the bug. So I've documented it in the showcase.
I created a responsive dataTable with onselect. The onselect works perfectly well, but when the dataTable renders with the expansion button for rows, both events are fired on clicking the expansion button.
The same issue occurs when there are other actions in the row(E.g. Icons to Delete). Both actions are fired.
I am using Bootsfaces 1.3.0 and PrimeFaces 6.2