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

[Feature Request] v-data-table : Customize the v-checkbox header in the headers array #3486

Closed
Kleemer opened this issue Mar 7, 2018 · 4 comments
Assignees
Labels
T: enhancement Functionality that enhances existing features

Comments

@Kleemer
Copy link

Kleemer commented Mar 7, 2018

New Functionality
Allow to customize only some headers in a Data table.

I want to add some custom classes to the checkbox column, but not to my other columns. I know I can add some classes in the headers array, but there is no way to access the checkbox header other than using <template slot="headers" slot-scope="props">, but if I do that I have to manually iterate in my headers array instead of having the default behavior.

Improvements
The only workaround is to customize all headers using the "headers" slot, but that is not needed in my case and I guess I don't see why we cannot easily access the v-checkbox header.

Bugs or Edge Cases it Helps Avoid
More friendly use of the v-checkbox header.

@nekosaur nekosaur added the pending review The issue is still pending disposition label Mar 8, 2018
@nekosaur
Copy link
Member

nekosaur commented Mar 8, 2018

Please show how would you imagine the final markup of this feature would look like

@Kleemer
Copy link
Author

Kleemer commented Mar 12, 2018

I guess I would see something like that :

data () {
      return {
        headers: [
          { type: 'checkbox', class: "checkbox-class" }
          { sortable: false },
          { text: 'Title', value: 'title' },
          { text: 'Something', value: 'smth' },
          { text: 'Other', value: 'other' }
        ]
      }
    }
[...]

We should be able to describe the first header column as 'checkbox', and then give the same properties as the other headers.

The only other possibility would be a new props 'select-all-class' however I do find that a little bit less elegant.

@nekosaur nekosaur added T: enhancement Functionality that enhances existing features and removed pending review The issue is still pending disposition labels Mar 12, 2018
@nekosaur nekosaur mentioned this issue Oct 6, 2018
9 tasks
@nekosaur nekosaur mentioned this issue Nov 26, 2018
9 tasks
@nekosaur nekosaur self-assigned this Jan 26, 2019
@blalan05
Copy link
Member

blalan05 commented Apr 3, 2019

available in the 2.0 alpha.

@blalan05 blalan05 closed this as completed Apr 3, 2019
@ManishaDhingraNiit
Copy link

is there any work around for this feature for release "vuetify": "^1.5.1",

@lock lock bot locked as resolved and limited conversation to collaborators May 20, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
T: enhancement Functionality that enhances existing features
Projects
None yet
Development

No branches or pull requests

4 participants