Questions tagged [v-data-table]
157 questions
2
votes
1 answer
VueJs 2.6.11 + Vuetify - vdata-table - BUG?? - How do I keep width columns even when headers are hidden?
I have the same problem but with Vuejs2 : Vuetify v1.5 data table, how to determine column widths when the header is hidden
Here is what I have:
Dedey
- 247
- 1
- 8
2
votes
1 answer
Vue Data Table Headers All Appearing in One Column
I have a v-data-table and I am trying to print my headings, but with my code they are all appearing grouped into one column instead of across the entire table.
Vuetify
Dustin Cook
- 1,215
- 5
- 26
- 44
2
votes
1 answer
Vuetify custom header
I am using Vuetify .
How to add button on table header ?
This code is what I have tried so far.
…
user1833620
- 751
- 1
- 10
- 30
2
votes
2 answers
Vuetify data table get selected item
I have a v-data-table that has Show-select,
I want to get the data of what items I selected, at least alert the first column value upon check
. Im searching everywhere. i cant find answer to my problem.
…
James
- 23
- 1
- 1
- 3
2
votes
3 answers
Vuetify data-table row does not expand
I'm building a vuetify with button icons on the right-most column. The button icons appear when a data row is hovered. I'd like the data row to expand when the row is clicked, but it's not working.
Current codepen implementation…
IdoTuchman
- 67
- 1
- 9
1
vote
1 answer
Use regular v-data-table layout in mobile version
I've created a v-data-table, the behavior that is expected is not to put all the headers for every row of the table, (by default vuetify render as I said) I show the actual behavior:
What I need is to show the v-data-table headers as it does in…
francesco14
- 143
- 1
- 8
1
vote
1 answer
v-data-table checked validate v-text-field type number
How do I validate a number input field inside v-data-table? I want to set required only on checked row.
here's my code
…
Rio
- 41
- 9
1
vote
0 answers
Populating a v-data-table with filtered data from firebase
I am making a application for teachers to select exam tasks from different subjects and years that is pulling data from firebase database, after user selects all of 3 dropdown menu options. So when i have numbers in the third dropdown (where its…
Jaka Podlogar
- 29
- 3
1
vote
1 answer
Put ellipsis ... on v-data-table
I have a v-data-table with 5 columns, which some have predefined widths, and some don't.
I'd like only one line of text maximum for each item and display "..." when the text exceeds 1 line.
Quentin
- 65
- 9
1
vote
1 answer
Vuetify - how to reset sort in v-datatable
I need to create a button out of the table and upon click of the button I need to reset all the sort applied in any column of the v-datatable.
I am using the header config array to set sortable for one of the column in the datatable.
headers = [
…
Avneesh
- 149
- 1
- 1
- 7
1
vote
1 answer
CRUD VUE JS PUT METHOD DOESNT WORKS
Why does my edit button in a vue data-table not work? The method creates a new line in the table. I want do edit a line.
template
Gabriela V.
- 11
- 1
1
vote
1 answer
How to vertically and horizontally center messages
I'd like having my 'no data available' message centered. Any suggestions?
PyKKe
- 67
- 7
1
vote
1 answer
Vuetify v-data-table click on row
I'm currently working on a vue project using vuetify as our main component-library. We display some information with the v-data-table component and are redirecting to another view if a row is clicked. This works totally fine.
In user testing an…
ix.trc
- 69
- 2
- 6
1
vote
1 answer
Implement pagination on Vuetify v-data-table and v-data-footer
I have elaborated a solution to have pagination with continuation tokens on a v-data-table but I have arrived to a dead end. I'm using Vuetify 2.5.6 and cannot migrate to version 3
I have a data-table like the one below. I have a vuex store that…
Alex
- 975
- 10
- 24
1
vote
1 answer
Vuetify - How to access element in v-data-table at current cursor position
I'm using v-data-table to list locations that are also shown on a map.
It would be nice to synchronize the highlighting so that if the cursor hovers over a
location in the table, the same location would be highlighted on the map.
Is there a way to…
niklash
- 37
- 9
I am using Vuetify .
How to add button on table header ?
This code is what I have tried so far.
…
How to vertically and horizontally center
user1833620
- 751
- 1
- 10
- 30
2
votes
2 answers
Vuetify data table get selected item
I have a v-data-table that has Show-select,
I want to get the data of what items I selected, at least alert the first column value upon check
. Im searching everywhere. i cant find answer to my problem.
…
James
- 23
- 1
- 1
- 3
2
votes
3 answers
Vuetify data-table row does not expand
I'm building a vuetify with button icons on the right-most column. The button icons appear when a data row is hovered. I'd like the data row to expand when the row is clicked, but it's not working.
Current codepen implementation…
IdoTuchman
- 67
- 1
- 9
1
vote
1 answer
Use regular v-data-table layout in mobile version
I've created a v-data-table, the behavior that is expected is not to put all the headers for every row of the table, (by default vuetify render as I said) I show the actual behavior:
What I need is to show the v-data-table headers as it does in…
francesco14
- 143
- 1
- 8
1
vote
1 answer
v-data-table checked validate v-text-field type number
How do I validate a number input field inside v-data-table? I want to set required only on checked row.
here's my code
…
Rio
- 41
- 9
1
vote
0 answers
Populating a v-data-table with filtered data from firebase
I am making a application for teachers to select exam tasks from different subjects and years that is pulling data from firebase database, after user selects all of 3 dropdown menu options. So when i have numbers in the third dropdown (where its…
Jaka Podlogar
- 29
- 3
1
vote
1 answer
Put ellipsis ... on v-data-table
I have a v-data-table with 5 columns, which some have predefined widths, and some don't.
I'd like only one line of text maximum for each item and display "..." when the text exceeds 1 line.
Quentin
- 65
- 9
1
vote
1 answer
Vuetify - how to reset sort in v-datatable
I need to create a button out of the table and upon click of the button I need to reset all the sort applied in any column of the v-datatable.
I am using the header config array to set sortable for one of the column in the datatable.
headers = [
…
Avneesh
- 149
- 1
- 1
- 7
1
vote
1 answer
CRUD VUE JS PUT METHOD DOESNT WORKS
Why does my edit button in a vue data-table not work? The method creates a new line in the table. I want do edit a line.
template
Gabriela V.
- 11
- 1
1
vote
1 answer
How to vertically and horizontally center messages
I'd like having my 'no data available' message centered. Any suggestions?
PyKKe
- 67
- 7
1
vote
1 answer
Vuetify v-data-table click on row
I'm currently working on a vue project using vuetify as our main component-library. We display some information with the v-data-table component and are redirecting to another view if a row is clicked. This works totally fine.
In user testing an…
ix.trc
- 69
- 2
- 6
1
vote
1 answer
Implement pagination on Vuetify v-data-table and v-data-footer
I have elaborated a solution to have pagination with continuation tokens on a v-data-table but I have arrived to a dead end. I'm using Vuetify 2.5.6 and cannot migrate to version 3
I have a data-table like the one below. I have a vuex store that…
Alex
- 975
- 10
- 24
1
vote
1 answer
Vuetify - How to access element in v-data-table at current cursor position
I'm using v-data-table to list locations that are also shown on a map.
It would be nice to synchronize the highlighting so that if the cursor hovers over a
location in the table, the same location would be highlighted on the map.
Is there a way to…
niklash
- 37
- 9