lundi 5 novembre 2018

Primefaces disable other datatable checkbox when limit > twenty

I've got datatable of vehicles with checkboxes:

enter image description here

I have the requierement to disable other rows if a limit of 20 rows are alrady selected, I can disable one of the selected, unblock all the other, select other row and if limit is reached block all other rows.

This is my actual datatable:

<p:dataTable value="#{trackingController.vehicles}" id="gmap_table"
                                         widgetVar="gmap_table"
                                         selection="#{trackingController.selectedVehicles}"
                                         paginator="true"
                                         paginatorPosition="bottom"
                                         rowsPerPageTemplate="20,15"
                                         rows="20" lazy="false"
                                         reflow="true"
                                         var="vehicle" rowStatePreserved="true"
                                         rowKey="#{vehicle.vehicleId}"
                                         emptyMessage="Sin Registros por Mostrar"
                                         rendered="#{!trackingController.mobileView}"
                                         style="font-size:12px; padding: 5px !important; width: 100% !important;"
                                         styleClass="gmap_table">
                                <p:ajax event="rowSelectCheckbox"
                                        listener="#{trackingController.onRowCheckBoxSelect}"
                                        update=":gmap_form:messages,gmap_table" oncomplete="addMarker(xhr, status, args)"/>
                                <p:ajax event="rowUnselectCheckbox" listener="#{trackingController.onRowUnselect}"
                                        update=":gmap_form:messages,@(.gmap_table)" oncomplete="removeMarker(xhr, status, args)"/>
                                <p:ajax event="toggleSelect" listener="#{trackingController.onToggleSelect}"
                                        onstart="PF('gmap_table_block_ui').show()"
                                        onsuccess="PF('gmap_table_block_ui').hide()"
                                        process="@this"
                                        partialSubmit="true" async="true"
                                        update=":gmap_form:messages,@(.gmap_table)" oncomplete="addMarker(xhr, status, args)"/>
                                <p:ajax event="rowSelect"
                                        oncomplete="restartMarkersOnRowSelection(xhr, status, args)"
                                        listener="#{trackingController.onRowSelect}" update=":gmap_form:messages,gmap_table"/>
                                <p:ajax event="rowUnselect" oncomplete="removeMarker(xhr, status, args)"
                                        listener="#{trackingController.onRowUnselect}"
                                        update=":gmap_form:messages"/>
                                <p:column selectionMode="multiple" style="width:16px;text-align:center;"/>
</p:dataTable>

If trackingController.selectedVehicles > 20 then what I need

I have found than: disabledSelection="#{trackingController.selectedVehicles ne null}" do something similar to what I need, but only block all checkboxes and cannot select or deselect the checkboxes, or maybe I can reach this by * CSS *

I will be glad for any help, Regards.




Aucun commentaire:

Enregistrer un commentaire