Vue3-datatables
  • Dependencies & Compatability
  • Getting Started
  • Client Table
    • Asynchronous Loading
    • Grouping
    • Filtering Algorithm
    • Editable Cells
  • Server Table
    • Implementations
    • Custom Request Function
    • Setting Multiple Request Parameters
    • Error Message
    • Draw Counter
  • Dependencies & Compatability
  • Getting Started
  • Virtual Pagination
  • Column Templates
  • Nested Data Structures
  • Selectable Rows
  • List Filters
  • Custom Template
  • Custom Filters
  • Multiple Sorting
  • Date Columns
  • Custom Sorting
  • Conditional Cell Styling
  • Columns Visibility
  • Child Rows
  • Properties
  • Slots
  • Methods
  • Events
Powered by GitBook
On this page
  1. Server Table

Draw Counter

Since the table sends asynchronous requests, the received response might not correspond to the latest request. To solve this problem you can employ the `useDrawCounter` option like so:

{
    useDrawCounter: true
}

This will add an incrementing draw parameter to the each request. On the server-side you should return this parameter with the response, using the same draw key. E.g in Laravel:

return [
    'data'=>[],
    'count'=>0,
    'draw'=>request('draw')
]

The table will then compare the response draw value with its own draw counter and only process the response if the two match.

If you are using axios pending requests will be automatically canceled when a new request is sent

PreviousError MessageNextDependencies & Compatability

Last updated 1 year ago