1250 lines
60 KiB
Plaintext
1250 lines
60 KiB
Plaintext
- var datatable = true;
|
|
- var page_datatable = true;
|
|
- var theme_customizer = true;
|
|
- var sidebar = true;
|
|
- var slick = true;
|
|
- var header_slider = true;
|
|
- var animate = true;
|
|
- var scrollbar = true;
|
|
doctype html
|
|
html(lang='en')
|
|
include ../../components/header-files
|
|
body
|
|
include ../../components/loader
|
|
include ../../components/taptop
|
|
// page-wrapper Start
|
|
#pageWrapper.page-wrapper.compact-wrapper
|
|
include ../../components/header
|
|
// Page Body Start
|
|
.page-body-wrapper
|
|
include ../../components/sidebar
|
|
.page-body
|
|
.container-fluid
|
|
.page-title
|
|
.row
|
|
.col-6
|
|
h3
|
|
| DATA Source DataTables
|
|
|
|
.col-6
|
|
ol.breadcrumb
|
|
li.breadcrumb-item
|
|
a(href='index.html')
|
|
svg.stroke-icon
|
|
use(href='../assets/svg/icon-sprite.svg#stroke-home')
|
|
li.breadcrumb-item Data Tables
|
|
li.breadcrumb-item.active DATA Source DataTables
|
|
// Container-fluid starts
|
|
.container-fluid
|
|
.row
|
|
// HTML (DOM) sourced data Starts
|
|
.col-sm-12
|
|
.card
|
|
.card-header.pb-0.card-no-border
|
|
h3.mb-3 HTML (DOM) sourced data
|
|
span
|
|
| The foundation for DataTables is progressive enhancement, so it is very adept at reading table information directly from the DOM. This example shows how easy it is to add searching, ordering and paging to your HTML table by simply running DataTables on it.
|
|
.card-body
|
|
.table-responsive
|
|
table#data-source-1.display(style='width:100%')
|
|
thead
|
|
tr
|
|
th Name
|
|
th Position
|
|
th Salary
|
|
th Office
|
|
th CV
|
|
th Status
|
|
th E-mail
|
|
th Action
|
|
|
|
|
|
tbody
|
|
tr
|
|
td Tiger Nixon
|
|
td System Architect
|
|
td $320,800
|
|
td Edinburgh
|
|
td.action
|
|
a.pdf(href="sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td t.nixon@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Garrett Winters
|
|
td Accountant
|
|
td $170,750
|
|
td Tokyo
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td g.winters@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Ashton Cox
|
|
td Junior Technical Author
|
|
td $86,000
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td a.cox@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Cedric Kelly
|
|
td Senior Javascript Developer
|
|
td $433,060
|
|
td Edinburgh
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td c.kelly@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Airi Satou
|
|
td Accountant
|
|
td $162,700
|
|
td Tokyo
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td a.satou@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Brielle Williamson
|
|
td Integration Specialist
|
|
td $372,000
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td b.williamson@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Herrod Chandler
|
|
td Sales Assistant
|
|
td $137,500
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td h.chandler@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Rhona Davidson
|
|
td Integration Specialist
|
|
td $327,900
|
|
td Tokyo
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td r.davidson@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Colleen Hurst
|
|
td Javascript Developer
|
|
td $205,500
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td c.hurst@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Sonya Frost
|
|
td Software Engineer
|
|
td $103,600
|
|
td Edinburgh
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td s.frost@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Jena Gaines
|
|
td Office Manager
|
|
td $90,560
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td j.gaines@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Quinn Flynn
|
|
td Support Lead
|
|
td $342,000
|
|
td Edinburgh
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td q.flynn@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Charde Marshall
|
|
td Regional Director
|
|
td $470,600
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td c.marshall@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Haley Kennedy
|
|
td Senior Marketing Designer
|
|
td $313,500
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td h.kennedy@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Tatyana Fitzpatrick
|
|
td Regional Director
|
|
td $385,750
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td t.fitzpatrick@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Michael Silva
|
|
td Marketing Designer
|
|
td $198,500
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td m.silva@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Paul Byrd
|
|
td Chief Financial Officer (CFO)
|
|
td $725,000
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td p.byrd@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Gloria Little
|
|
td Systems Administrator
|
|
td $237,500
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td g.little@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Bradley Greer
|
|
td Software Engineer
|
|
td $132,000
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td b.greer@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Dai Rios
|
|
td Personnel Lead
|
|
td $217,500
|
|
td Edinburgh
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td d.rios@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Jenette Caldwell
|
|
td Development Lead
|
|
td $345,000
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td j.caldwell@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Yuri Berry
|
|
td Chief Marketing Officer (CMO)
|
|
td $675,000
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td y.berry@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Caesar Vance
|
|
td Pre-Sales Support
|
|
td $106,450
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td c.vance@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Doris Wilder
|
|
td Sales Assistant
|
|
td $85,600
|
|
td Sidney
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td d.wilder@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Angelica Ramos
|
|
td Chief Executive Officer (CEO)
|
|
td $1,200,000
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td a.ramos@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Gavin Joyce
|
|
td Developer
|
|
td $92,575
|
|
td Edinburgh
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td g.joyce@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Jennifer Chang
|
|
td Regional Director
|
|
td $357,650
|
|
td Singapore
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td j.chang@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Brenden Wagner
|
|
td Software Engineer
|
|
td $206,850
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td b.wagner@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Fiona Green
|
|
td Chief Operating Officer (COO)
|
|
td $850,000
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td f.green@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Shou Itou
|
|
td Regional Marketing
|
|
td $163,000
|
|
td Tokyo
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td s.itou@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Michelle House
|
|
td Integration Specialist
|
|
td $95,400
|
|
td Sidney
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td m.house@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Suki Burks
|
|
td Developer
|
|
td $114,500
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td s.burks@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Prescott Bartlett
|
|
td Technical Author
|
|
td $145,000
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td p.bartlett@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Gavin Cortez
|
|
td Team Leader
|
|
td $235,500
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td g.cortez@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Martena Mccray
|
|
td Post-Sales support
|
|
td $324,050
|
|
td Edinburgh
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td m.mccray@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Unity Butler
|
|
td Marketing Designer
|
|
td $85,675
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td u.butler@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Howard Hatfield
|
|
td Office Manager
|
|
td $164,500
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td h.hatfield@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Hope Fuentes
|
|
td Secretary
|
|
td $109,850
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td h.fuentes@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Vivian Harrell
|
|
td Financial Controller
|
|
td $452,500
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td v.harrell@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Timothy Mooney
|
|
td Office Manager
|
|
td $136,200
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td t.mooney@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Jackson Bradshaw
|
|
td Director
|
|
td $645,750
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td j.bradshaw@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Olivia Liang
|
|
td Support Engineer
|
|
td $234,500
|
|
td Singapore
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td o.liang@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Bruno Nash
|
|
td Software Engineer
|
|
td $163,500
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td b.nash@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Sakura Yamamoto
|
|
td Support Engineer
|
|
td $139,575
|
|
td Tokyo
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td s.yamamoto@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Thor Walton
|
|
td Developer
|
|
td $98,540
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td t.walton@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Finn Camacho
|
|
td Support Engineer
|
|
td $87,500
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td f.camacho@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Serge Baldwin
|
|
td Data Coordinator
|
|
td $138,575
|
|
td Singapore
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td s.baldwin@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Zenaida Frank
|
|
td Software Engineer
|
|
td $125,250
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td z.frank@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Zorita Serrano
|
|
td Software Engineer
|
|
td $115,000
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td z.serrano@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Jennifer Acosta
|
|
td Junior Javascript Developer
|
|
td $75,650
|
|
td Edinburgh
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td j.acosta@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Cara Stevens
|
|
td Sales Assistant
|
|
td $145,600
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td c.stevens@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Hermione Butler
|
|
td Regional Director
|
|
td $356,250
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td h.butler@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Lael Greer
|
|
td Systems Administrator
|
|
td $103,500
|
|
td London
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-danger Pending
|
|
td l.greer@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Jonas Alexander
|
|
td Developer
|
|
td $86,500
|
|
td San Francisco
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-warning in process
|
|
td j.alexander@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Shad Decker
|
|
td Regional Director
|
|
td $183,000
|
|
td Edinburgh
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td s.decker@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Michael Bruce
|
|
td Javascript Developer
|
|
td $183,000
|
|
td Singapore
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td m.bruce@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tr
|
|
td Donna Snider
|
|
td Customer Support
|
|
td $112,000
|
|
td New York
|
|
td.action
|
|
a.pdf(href="../assets/pdf/sample.pdf" target="_blank")
|
|
i.icofont.icofont-file-pdf
|
|
td
|
|
span.badge.rounded-pill.badge-success hired
|
|
td d.snider@datatables.net
|
|
td
|
|
ul.action
|
|
li.edit
|
|
a(href="#")
|
|
i.icon-pencil-alt
|
|
li.delete
|
|
a(href="#")
|
|
i.icon-trash
|
|
tfoot
|
|
tr
|
|
th Name
|
|
th Position
|
|
th Salary
|
|
th Office
|
|
th CV
|
|
th Status
|
|
th E-mail
|
|
th Action
|
|
// HTML (DOM) sourced data Ends
|
|
// Ajax sourced data Starts
|
|
.col-sm-12
|
|
.card
|
|
.card-header.pb-0.card-no-border
|
|
h3.mb-3 Ajax sourced data
|
|
span
|
|
| DataTables has the ability to read data from virtually any JSON data source that can be obtained by Ajax. This can be done, in its most simple form, by setting the
|
|
code ajax:option
|
|
| option to the address of the JSON data source.
|
|
.card-body
|
|
.table-responsive
|
|
table#data-source-2.display(style='width:100%')
|
|
thead
|
|
tr
|
|
th Name
|
|
th Position
|
|
th Office
|
|
th Extn.
|
|
th Start date
|
|
th Salary
|
|
tfoot
|
|
tr
|
|
th Name
|
|
th Position
|
|
th Office
|
|
th Extn.
|
|
th Start date
|
|
th Salary
|
|
// Ajax sourced data Ends
|
|
// Javascript sourced data Starts
|
|
.col-sm-12
|
|
.card
|
|
.card-header.pb-0.card-no-border
|
|
h3.mb-3 Javascript sourced data
|
|
span
|
|
| At times you will wish to be able to create a table from dynamic information passed directly to DataTables, rather than having it read from the document.
|
|
| This is achieved using the
|
|
code.option(title='DataTables initialisation option') data
|
|
| option in the initialisation object, passing in an array of data to be used (like all other DataTables handled data, this can be arrays or objects using the
|
|
code.option(title='DataTables initialisation option') columns.data
|
|
| option).
|
|
span
|
|
| A
|
|
code.tag(title='HTML tag') table
|
|
| must be available on the page for DataTables to use. This examples shows an empty
|
|
code.tag(title='HTML tag') table
|
|
| element being initialising as a DataTable with a set of data from a Javascript array. The columns in the table are dynamically created
|
|
| based on the
|
|
code.option(title='DataTables initialisation option') columns.title
|
|
| configuration option.
|
|
.card-body
|
|
.table-responsive
|
|
table#data-source-3.display.w-100
|
|
// Javascript sourced data Ends
|
|
// Server-side processing Starts
|
|
.col-sm-12
|
|
.card
|
|
.card-header.pb-0.card-no-border
|
|
h3.mb-3 Server-side processing
|
|
span
|
|
| There are many ways to get your data into DataTables, and if you are working with seriously large databases, you might want to consider using the server-side options that DataTables provides. With server-side processing enabled, all paging, searching, ordering actions that DataTables performs are handed off to a server where an SQL engine (or similar) can perform these actions on the large data set (after all, that's what the database engine is designed for!). As such, each draw of the table will result in a new Ajax request being made to get the required data.
|
|
span
|
|
| Server-side processing is enabled by setting the
|
|
code.option(title='DataTables initialisation option') serverSide:option
|
|
| option to
|
|
code true
|
|
| and providing an Ajax data source through the
|
|
code.option(title='DataTables initialisation option') ajax:option
|
|
| option.
|
|
.card-body
|
|
.table-responsive
|
|
table#data-source-4.display(style='width:100%')
|
|
thead
|
|
tr
|
|
th First name
|
|
th Last name
|
|
th Position
|
|
th Office
|
|
th Start date
|
|
th Salary
|
|
th Action
|
|
tfoot
|
|
tr
|
|
th First name
|
|
th Last name
|
|
th Position
|
|
th Office
|
|
th Start date
|
|
th Salary
|
|
th Action
|
|
// Container-fluid Ends
|
|
include ../../components/footer
|
|
include ../../components/footer-files
|