Questions tagged [v-data-table]

157 questions
1
vote
1 answer

How does vue v-data-table rowspan works?

I'm new to programing and started with vue, now working on a web page. (please understand that my English isn't perfect) I am tring to make 4 rows into 1 row in my table. Not all the columes, but only one. I want my table to look like this: enter…
Lelouch
  • 11
  • 2
1
vote
2 answers

vue data-table server side search next button disabled when less than 10 pages in result

I implemented server side search and pagination with Vue data-table (v-data-table). When I start typing in the search bar, at first with only an 'n' it returns 55 pages, which is correct and I can move through the pages with next/previous button.…
Niels
  • 537
  • 5
  • 22
1
vote
1 answer

Converting Vuetify 1.x v-slot activator to 2.x via v-data-table

I have a piece of working code from Veutify 1.5.6 that includes an icon inside of a data table that, when clicked, displays a menu. When clicked the activator shows the list that was activated. I have a codepen with this example I want the same…
Stephen Romero
  • 2,812
  • 4
  • 25
  • 48
1
vote
2 answers

How to catch scrolling event on v-data-table component?

Is there a way to catch scrolling event on v-data-table component of Vuetify frmework? I mean the case when table has a fixed height so the table body will scroll.
Zurab
  • 1,411
  • 3
  • 17
  • 39
1
vote
1 answer

Implementing a checkbox in v-data-table header

I have a v-data-table in which I have the rows with checkboxes. I'm trying to implement a checkbox in the table header where selecting the checkbox would select the entire checkboxes in the table row. This is my code:
Vicky
  • 11
  • 1
  • 3
1
vote
0 answers

Dynamic item template slots within v-data-table with custom components & helpers

Say I have a custom component that uses Vuetify's v-data-table within. Within this component, there's multiple other custom components such as loaders and specific column-based components for displaying data in a certain way. I found myself using…
trainoasis
  • 6,419
  • 12
  • 51
  • 82
1
vote
2 answers

Increase font size of header in v-data-table Vuetify

I am trying to increase the font size of the headers to make it more distinctive to the rows in the table which is plot using v-data-table. I refereed to the solutions in the similar questions Question 1 and Question 2 but the solutions didn't seem…
Blacky_99
  • 155
  • 4
  • 20
1
vote
0 answers

Vuetify v-data-table expanded items, only expand certain items

I'm got a vuetify v-data-table that has the expandable icon on each item currently. It works fine but I'm interested in having the icon only on rows where a certain condition is true about the item and I can't seem to work out how to do it. I've…
Mee
  • 129
  • 2
  • 10
1
vote
1 answer

Vuetify data table v-model is not reactive to changes inside the table items

I have a Vuetify data table that is refreshed from the server every 5 seconds. It has selectable rows. If you select a row, then something in the data changes, the v-model array of selected items does not reflect the changes inside the row items. …
hobbes_child
  • 131
  • 2
  • 12
1
vote
1 answer

Vuetify - v-simple-checkbox prevents v-data-table row.click event

When v-simple-checkbox is used in v-data-table, clicking on the checkbox or the area around it doesn't invoke row.click event. This CodePen example shows selecting a data table row on row.click. However, if more columns with checkboxes are used it's…
Toni
  • 3,296
  • 2
  • 13
  • 34
1
vote
1 answer

Vuetify CRUD app with and action buttons

I'm currently learning VueJS for work and I'm trying to build a CRUD app that displays items from an API to a , and I want to edit, delete, and create new items using . This is my main screen: