Primefaces datatable with checkbox selection ONLY

9
votes

In my project, I use datatable with <p:column selectionMode="multiple" /> so that the entries can be multiple selected using the checkboxes.

However, when the user click on a row, all previous selection is unselected and only that row is selected. This behaviour is unexpected and annoying. I would like to disable the behaviour of rowSelect and rowUnselect on row clicking, but seems I had no way to do but hacking the source of datatable.js.

Does anyone implement this before? Thanks for answering.

Using:

primefaces 3.5

mojarra 2.1.6

glassfish 3.1.2.2

2
jsfprimefaces
Provide your code. So that we can find the error or logical mistake in that. – Sathesh S
Here his code is not important as the same issue is happening in the showcase itself. It seems to be only with the checkbox and not with radio button. I also want to get the same behaviour the OP mentioned. Anybody has solved that? – Xtreme Biker

2 Answers

16
votes

According to this feature request, this feature is now supported in Primefaces versions 5.0.3 & 5.1 by simply adding rowSelectMode="checkbox" to the datatable.

Documentation reference (PF 5.1):

Use rowSelectMode option to customize the default behavior on row click of a multiple selection enabled datatable. Default value is "new" that clears previous selections, "add" mode keeps previous selections same as selecting a row with mouse click when metakey is on and "checkbox" mode allows row selection with checkboxes only.

0
votes

Put this in your page, might help stopping selection when you click a row.

$(document).ready(
    function() {
        $("tr td").click(function(event) {
            if (!$(this).find("div").hasClass("ui-chkbox") 
                  || $(this).find("div").find("div").hasClass("ui-state-disabled")
                  || this == event.target) {
                event.stopPropagation();
        }
    });
});

The last condition (this == event.target) is needed when clicking the checkbox column itself outside of the checkbox.