How to use jQuery DataTable Plugin In Salesforce Lightning Component?

How To Use jQuery DataTable Plugin In Salesforce Lightning Component?

DataTables:

“DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, build upon the foundations of progressive enhancement,that adds all of these advanced features to any HTML table.” [1]

Here are some enhancement provide by DataTable Plugin to a HTML table:

datatables

Follow the steps to use jQuery Datatable In your Salesforce Lightning Component :

  1. Download jQuery library from link below.
    https://code.jquery.com/jquery-2.2.4.min.js

    To Download jQuery library go to the link and right click on the page and click save.

    DataTable

  2. Download jQuery Datatable Plug-in from link below.
    https://datatables.net/releases/DataTables-1.10.16.zip

  3. Add ‘jQuery’ library and ‘jQuery Datatable Plug-in’ as static resource in your Salesforce Org.
    Steps to add file as static resource

  4. Create Lightning component.
    • A snippet of code for your Lightning component-
      DataTable1
    • A snippet of code for your JavaScript Controller –
      DataTable2
    • A snippet of code for your Apex Controller –
      DataTable3
    • A snippet of code for your Lightning Application –
      DataTable4

Here is a video that shows how data table work on lightning component UI :-

——————

Reference:
https://datatables.net/

0 Comments

Leave a Reply

CONTACT US

We're not around right now. But you can send us an email and we'll get back to you, asap.

Sending

About Us

Forcetalks is a Salesforce collaboration platform for coders & developers, geeks & nerds, consultants & business heads, admins & architects, managers & marketers and of course the business owners. A community where you can learn from, where you can contribute to. For you. For Salesforce. Read More...

Copyright 2019 Forcetalks. All Right Reserved.

Log in with your credentials

or    

Forgot your details?