How can Vue be used in combination with DataTables

DataTables (https://datatables.net) has been downloaded through NPM. But in Vue, I don’t know how to use datatable. Baidu is also solving internal problems. Please tell your eldest brother. bese

Hi!

Datatables is based on jQuery it’s quite hard to integrate it in VueJS. Rather try VueJS counterpart like https://njleonzhang.github.io/vue-data-tables/#/?id=vue-data-tables

Hello. I was having the same trouble as you have. I have worked to rebuild the DataTable jQuery plugin using only VueJS. So far, my project, VueDataTable, has the following features:

  • multiple column sorting
  • search filter
  • pagination
  • entry length options
  • customization text
  • language support for English, Portuguese, and Spanish

You can install it with npm. For more information, please check that out on Github.

I hope this will help you or someone else.

very cool. how would i use this in an NPM-free environment? current project scope is an SPA that as very little elbow room, so NPM is unavailable. plus, i’m very new to Vue… be gentle. :smiley:

presuming, just DL and link… but want to verify.

UPDATED

I’ve figured out a way to implement my VueDataTable project without npm. Please, check out this demo project on codesandbox. It works nicely :slight_smile:

OLD
Thank you iansebryk!

So, currently my plugin can only be used with npm. But I will work to make that available for a NPM-free environment. Actually, this is the first project I have ever published and I still don’t know how to do things properly… but if you know how to do that your help will be appreciated! Feel free to contribute to my project

When I have a CDN link of my project I will post it here :slight_smile:

you, @AndreSouzaAbreu, are a rockstar of the most metal order! :metal: i’ll be running it through my current project tonight and will give feedback as i go. this is so friggin’ awesome! :smiley:

EDIT:
i just took a closer look… bruh. this just beats the pants of everything i could have imagined. thank you!

EDIT 2:
maybe only 4 pages of data? :smiley: …63 is a bit boggy through sandbox… :laughing:

haven’t had a chance to finish the implementation yet. waiting for approval for adding VueEX to our loadout. :stuck_out_tongue:

@AndreSouzaAbreu sorry to take so long to get back to you. thanks for such great work! the table is working wonderfully and i am so grateful. took me a while to get VueEx approved and then to wrap my head around it, but once i did, it was cake. you’re awesome bud! :smiley:

1 Like

Thank you very much for the response! I’m glad it worked for you :smiley:

By the way, a couple of days ago I just updated VueDataTable. Now there are options such as export displaying rows to JSON, txt, xlsx, csv. There is also an option to go to a specific page (instead of using Next and Previous buttons to change current page of pagination). There are no break changes to implement it :slight_smile:

cheers

1 Like

@AndreSouzaAbreu May I know if your package include server-side pagination?
Thank you…