Can I invoke the draw() function on a Datatablevue3 component?
Can I invoke the draw() function on a Datatablevue3 component?
Description of problem:
I'm building an app and I want to use Datatables with Vue 3 and bootstrap 5 with the serverside option. I'll be using Datatables is a lot of pages and I don't want to get the data independently and populate the table using the data option. It would mean that I'll have to load the entire data into the clientside. In a previous app I did with datatables I used the draw() function to dynamically display the latest records on the table. But with the Datatablevue3, how can I call a function that makes the Ajax call to refresh the data of the table
This question has accepted answers - jump to:
Answers
You can grab a DataTables API reference as described here. You'll then be able to call
draw()on it.Allan
Oh wow. I read that vue installation doc many times but I just didn't get that part. Let me try it. Thanks a lot.
But i don't fully understand the code.
this is the example
if we use let to declare dt. How come dt is appended here table.value.dt and then assigned to dt? I understand the ref and the const table. Pls could you explain a little more.. pls. It will help me know how to use it better
Vue will make a reference we can access via the
tablevariable (line 2). That reference then has avalue.dtproperty which is assigned by the Vue DataTables component. That is the API reference. We use line 5 to assign it to the simpledtvariable for use.I don't massively like that part of the API either... Its a little bit too much like "magic"
Allan
Yes it does look like magic. I starred at it for a while. Means I can call the variable anything. Great! Your explanation has lifted a lot off my shoulders. Oh thanks alot Allan
Places you right into one of the two really hard problems in programming...
Allan