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

Add Slot to Table Check All #3779

Closed
Minhyme opened this issue Sep 1, 2022 · 0 comments · Fixed by #3793
Closed

Add Slot to Table Check All #3779

Minhyme opened this issue Sep 1, 2022 · 0 comments · Fixed by #3793

Comments

@Minhyme
Copy link
Contributor

Minhyme commented Sep 1, 2022

Description

Provide a slot wrapping the existing b-checkbox for checking all rows.

<thead v-if="newColumns.length && showHeader">
    <tr>
        <th v-if="showDetailRowIcon" width="40px"/>
        <th
            :class="['checkbox-cell', { 'is-sticky': stickyCheckbox } ]"
            v-if="checkable && checkboxPosition === 'left'">
            <template v-if="headerCheckable">
                <slot name="check-all" :isAllChecked="isAllChecked" :isAllUncheckable="isAllUncheckable" :checkAll="checkAll">
                    <b-checkbox
                      autocomplete="off"
                      :value="isAllChecked"
                      :type="checkboxType"
                      :disabled="isAllUncheckable"
                      @change.native="checkAll"/>
                </slot>
            </template>
        </th>

Why Buefy need this feature

When using pagination, you can either use the default functionality of selecting all on the current page, or override this behavior by catching the check-all event. You cannot however do both. Providing a slot and binding the computed variables to that slot will allow people to create custom components which can achieve both goals.

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

Successfully merging a pull request may close this issue.

1 participant