Skip to content

Commit

Permalink
Bugfix checkboxes behavior when search or filters are active (#522)
Browse files Browse the repository at this point in the history 
Bugfix checkboxes behavior when search or filters are active

- If the search or filter is active, we must display the count of checked rows only for "visible" items (results of search or filtered results). Therefore, the toggleSelectAll() method must also check or uncheck all "visible" items when the search or filters are active.
  • Loading branch information
@renardudezert
renardudezert authored Nov 27, 2022
1 parent c13a4d0 commit f140158
Show file tree
Hide file tree
Showing 3 changed files with 71 additions and 21 deletions.
2 changes: 1 addition & 1 deletion resources/views/livewire/datatables/datatable.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,7 @@ class="px-3 py-2 text-xs font-medium tracking-wider text-green-500 uppercase bg-
@unless($column['hidden'])
<div class="flex justify-center table-cell w-32 h-12 px-6 py-4 overflow-hidden text-xs font-medium tracking-wider text-left text-gray-500 uppercase align-top border-b border-gray-200 bg-gray-50 leading-4 focus:outline-none">
<div class="px-3 py-1 rounded @if(count($selected)) bg-orange-400 @else bg-gray-200 @endif text-white text-center">
{{ count($selected) }}
{{ count($visibleSelected) }}
</div>
</div>
@endunless
Expand Down
2 changes: 1 addition & 1 deletion resources/views/livewire/datatables/filters/checkbox.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ class="flex flex-col items-center h-full px-6 py-5 overflow-hidden text-xs font-
type="checkbox"
wire:click="toggleSelectAll"
class="w-4 h-4 mt-1 text-blue-600 form-checkbox transition duration-150 ease-in-out"
@if(count($selected) === $this->results->total()) checked @endif
@if($this->results->total() === count($visibleSelected)) checked @endif
/>
</div>
</div>
88 changes: 69 additions & 19 deletions src/Http/Livewire/LivewireDatatable.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,7 @@ class LivewireDatatable extends Component
public $persistSort = true;
public $persistPerPage = true;
public $persistFilters = true;
public $visibleSelected = [];
public $row = 1;

public $tablePrefix = '';
Expand Down Expand Up @@ -217,6 +218,7 @@ public function resetHiddenColumns()

public function updatedSearch()
{
$this->visibleSelected = ($this->search) ? array_intersect($this->getQuery()->get()->pluck('checkbox_attribute')->toArray(), $this->selected) : $this->selected;
$this->setPage(1);
}

Expand Down Expand Up @@ -704,21 +706,21 @@ public function getSortString($dbtable)
return Str::before($column['select'], ' AS ');
break;

default:

switch ($dbtable) {
case 'mysql':
return new Expression('`' . $column['name'] . '`');
break;
case 'pgsql':
return new Expression('"' . $column['name'] . '"');
break;
case 'sqlsrv':
return new Expression("'" . $column['name'] . "'");
break;
default:
return new Expression("'" . $column['name'] . "'");
}
default:

switch ($dbtable) {
case 'mysql':
return new Expression('`' . $column['name'] . '`');
break;
case 'pgsql':
return new Expression('"' . $column['name'] . '"');
break;
case 'sqlsrv':
return new Expression("'" . $column['name'] . "'");
break;
default:
return new Expression("'" . $column['name'] . "'");
}
}
}

Expand Down Expand Up @@ -870,13 +872,15 @@ public function isGroupHidden($group)
public function doBooleanFilter($index, $value)
{
$this->activeBooleanFilters[$index] = $value;
$this->setVisibleSelected();
$this->setPage(1);
$this->setSessionStoredFilters();
}

public function doSelectFilter($index, $value)
{
$this->activeSelectFilters[$index][] = $value;
$this->setVisibleSelected();
$this->setPage(1);
$this->setSessionStoredFilters();
}
Expand All @@ -886,35 +890,39 @@ public function doTextFilter($index, $value)
foreach (explode(' ', $value) as $val) {
$this->activeTextFilters[$index][] = $val;
}

$this->setVisibleSelected();
$this->setPage(1);
$this->setSessionStoredFilters();
}

public function doDateFilterStart($index, $start)
{
$this->activeDateFilters[$index]['start'] = $start;
$this->setVisibleSelected();
$this->setPage(1);
$this->setSessionStoredFilters();
}

public function doDateFilterEnd($index, $end)
{
$this->activeDateFilters[$index]['end'] = $end;
$this->setVisibleSelected();
$this->setPage(1);
$this->setSessionStoredFilters();
}

public function doTimeFilterStart($index, $start)
{
$this->activeTimeFilters[$index]['start'] = $start;
$this->setVisibleSelected();
$this->setPage(1);
$this->setSessionStoredFilters();
}

public function doTimeFilterEnd($index, $end)
{
$this->activeTimeFilters[$index]['end'] = $end;
$this->setVisibleSelected();
$this->setPage(1);
$this->setSessionStoredFilters();
}
Expand All @@ -923,6 +931,7 @@ public function doNumberFilterStart($index, $start)
{
$this->activeNumberFilters[$index]['start'] = ($start != '') ? (int) $start : null;
$this->clearEmptyNumberFilter($index);
$this->setVisibleSelected();
$this->setPage(1);
$this->setSessionStoredFilters();
}
Expand All @@ -931,6 +940,7 @@ public function doNumberFilterEnd($index, $end)
{
$this->activeNumberFilters[$index]['end'] = ($end != '') ? (int) $end : null;
$this->clearEmptyNumberFilter($index);
$this->setVisibleSelected();
$this->setPage(1);
$this->setSessionStoredFilters();
}
Expand All @@ -947,6 +957,7 @@ public function clearEmptyNumberFilter($index)
public function removeSelectFilter($column, $key = null)
{
unset($this->activeSelectFilters[$column][$key]);
$this->visibleSelected = $this->selected;
if (count($this->activeSelectFilters[$column]) < 1) {
unset($this->activeSelectFilters[$column]);
}
Expand All @@ -964,6 +975,7 @@ public function clearAllFilters()
$this->activeNumberFilters = [];
$this->complexQuery = null;
$this->userFilter = null;
$this->visibleSelected = $this->selected;
$this->setPage(1);
$this->setSessionStoredFilters();

Expand All @@ -973,6 +985,7 @@ public function clearAllFilters()
public function removeBooleanFilter($column)
{
unset($this->activeBooleanFilters[$column]);
$this->visibleSelected = $this->selected;
$this->setSessionStoredFilters();
}

Expand All @@ -986,12 +999,14 @@ public function removeTextFilter($column, $key = null)
} else {
unset($this->activeTextFilters[$column]);
}
$this->visibleSelected = $this->selected;
$this->setSessionStoredFilters();
}

public function removeNumberFilter($column)
{
unset($this->activeNumberFilters[$column]);
$this->visibleSelected = $this->selected;
$this->setSessionStoredFilters();
}

Expand Down Expand Up @@ -1684,14 +1699,38 @@ public function checkboxQuery()

public function toggleSelectAll()
{
if (count($this->selected) === $this->getQuery()->getCountForPagination()) {
$this->selected = [];
$visible_checkboxes = $this->getQuery()->get()->pluck('checkbox_attribute')->toArray();
$visible_checkboxes = array_map('strval', $visible_checkboxes);
if ($this->searchOrFilterActive()) {
if (count($this->visibleSelected) === count($visible_checkboxes)) {
$this->selected = array_values(array_diff($this->selected, $visible_checkboxes));
$this->visibleSelected = [];
} else {
$this->selected = array_unique(array_merge($this->selected, $visible_checkboxes));
sort($this->selected);
$this->visibleSelected = $visible_checkboxes;
}
} else {
$this->selected = $this->checkboxQuery()->values()->toArray();
if (count($this->selected) === $this->getQuery()->getCountForPagination()) {
$this->selected = [];
} else {
$this->selected = $this->checkboxQuery()->values()->toArray();
}
$this->visibleSelected = $this->selected;
}

$this->forgetComputed();
}

public function updatedSelected()
{
if ($this->searchOrFilterActive()) {
$this->setVisibleSelected();
} else {
$this->visibleSelected = $this->selected;
}
}

public function rowIsSelected($row)
{
return isset($row->checkbox_attribute) && in_array($row->checkbox_attribute, $this->selected);
Expand Down Expand Up @@ -1802,4 +1841,15 @@ public function massActionOptionHandler()

$this->massActionOption = null;
}

private function searchOrFilterActive()
{
return ! empty($this->search) || $this->getActiveFiltersProperty();
}

private function setVisibleSelected()
{
$this->visibleSelected = array_intersect($this->getQuery()->get()->pluck('checkbox_attribute')->toArray(), $this->selected);
$this->visibleSelected = array_map('strval', $this->visibleSelected);
}
}

0 comments on commit f140158

Please sign in to comment.