Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Select rows/all rows with checkboxes #15

Open
wants to merge 3 commits into
base: master
Choose a base branch
from

Conversation

booni3
Copy link

@booni3 booni3 commented Dec 1, 2019

Overview

This pr provides traits that:

  1. Selecting of individual rows via checkbox
  2. Selecting all the rows on the current page
  3. When changing pages, deselect all rows.
  4. When selecting all rows then deselecting a single row also deselect the "select all" checkbox.

Example

Kapture 2019-12-01 at 20 05 06

Blade

Header, Select All Checkbox

<input class="form-check-input"
   type="checkbox"
   wire:model="allRowsSelected"
   wire:change="selectAllRows($event.target.checked)"
>

Row Checkbox, Select Row

<input class="form-check-input"
       type="checkbox"
       value="{{ $row->id }}"
       wire:model="selected.{{ $row->id }}"
       wire:change="selectRow($event.target.checked, {{ $row->id }})"
>

Still needs work

  1. On sort, some kind of hook is needed to reset the select all.

  2. Having the additional pagination trait is not ideal. It would be best if we can hook into page updates to run the clearSelected method but I am not sure if this is possible within livewire.

  3. selectRow method currently just clears the select All checkbox via allRowsSelected because we have model binding in place for the selected array. Expect there is a better way to do this.

Includes single row selection, select all rows, clearing selection when paginaiting
@coryrose1
Copy link
Owner

Hey @booni3 , this looks awesome! I'd love to have this feature added. Thanks for the work!

Are you open to collaborating? I'm working on another path for the cells using a view component in order to detect sort status and such. See issue/discussion #10 for more detail.

I'd love to work together and get all of these features tied together.

If you're up for it, I'm on twitter @ https://twitter.com/coryrose, or let me know if there's a better way to reach out.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants