• ENG
  • 2

    Cart

  • 4

    Notification View all

    • 30-04-2024Today
      Alice Goodwin

      Fashion should be fun. It shouldn't be labelled intellectual.

    • 28-06-20241 hour ago
      Herry Venter

      I am convinced that there can be luxury in simplicity.

    • 04-08-2024Today
      Loain Deo

      I feel that things happen for open new opportunities.

    • 12-11-2024Yesterday
      Fenter Jessy

      Sometimes the simplest things are the most profound.

  • Bookmark

  • 15

  • user
    Ava Davis

    Admin

API DataTables

  2. Data Tables
  3. API DataTables

Add rows

New rows can be added to a DataTable using therow.add() API method. Simply call the API function with the data for the new row (be it an array or object). Multiple rows can be added using therows.add() method (note the plural). Data can likewise be updated with the row().data() and row().remove() methods.Note that in order to see the new row in the table you must call thedraw() method, which is easily done through the chaining that the DataTables API employs.
Column 1Column 2Column 3Column 4Column 5
Column 1Column 2Column 3Column 4Column 5

Child rows (show extra / detailed information)

The DataTables API has a number of methods for attaching child rows to a parent row in the DataTable. This can be used to show additional information about a row, useful for cases where you wish to convey more information about a row than there is space for in the host table.
NamePositionOfficeSalary
NamePositionOfficeSalary

Row Selection And Deletion (Single Row)

It can be useful to provide the user with the option to select rows in a DataTable. This can be done by using a click event to add / remove a class on the table rows. The rows().data()method can then be used to get the data for the selected rows. In this case it is simply counting the number of selected rows, but much more complex interactions can easily be developed.
Employee NameJob DesignationCompany NameInvoice No.Credit/DebitDatePriorityBudgetAction
Tiger NixonSystem ArchitectTata Co.#AS61 1.4%2011/04/25Medium$320.800,00
Garrett WintersAccountantEdinburgh#FG63 1.4%2011/07/25Urgent$170.750,00
Ashton CoxJunior Technical AuthorMphasis Ltd#GH66 1.4%2009/01/12Medium$86.000,00
Cedric KellySenior Javascript DeveloperEdinburgh#UH22 1.4%2012/03/29Low$433.060,00
Airi SatouAccountantGoogle Inc.#TY33 2.5%2008/11/28Urgent$162.700,00
Brielle WilliamsonIntegration SpecialistMicrosoft#TS61 2.5%2012/12/02Low$372.000,00
Herrod ChandlerSales AssistantGoogle Co.#GF59 2.5%2012/08/06Medium$137.500,00
Rhona DavidsonIntegration SpecialistTokyo#FT55 1.4%2010/10/14Medium$327.900,00
Colleen HurstJavascript DeveloperGoogle Co.#NB39 2.8%2009/09/15Medium$205.500,00
Sonya FrostSoftware EngineerEdinburgh#BH23 2.5%2008/12/13Urgent$103.600,00
Jena GainesOffice ManagerTata Co.#HN30 1.4%2008/12/19High$90.560,00
Quinn FlynnSupport LeadEdinburgh#YH22 2.5%2013/03/03Urgent$342.000,00
Charde MarshallRegional DirectorGoogle Co.#FV36 1.4%2008/10/16Low$470.600,00
Haley KennedySenior Marketing DesignerTata Co.#TF43 2.5%2012/12/18Low$313.500,00
Tatyana FitzpatrickRegional DirectorInfosys Ltd.#DF19 1.4%2010/03/17Medium$385.750,00
Michael SilvaMarketing DesignerInfosys Ltd.#HD66 2.5%2012/11/27Medium$198.500,00
Paul ByrdChief Financial Officer (CFO)New York#NH64 9.8%2010/06/09Urgent$725.000,00
Gloria LittleSystems AdministratorNew York#MN59 2.8%2009/04/10Urgent$237.500,00
Bradley GreerSoftware EngineerTata Co.#JH41 9.8%2012/10/13High$132.000,00
Dai RiosPersonnel LeadEdinburgh#YT35 2.8%2012/09/26Low$217.500,00
Jenette CaldwellDevelopment LeadNew YorkLow#FG30 1.4%2011/09/03Urgent$345.000,00
Yuri BerryChief Marketing Officer (CMO)New York#VB40 5.6%2009/06/25Medium$675.000,00
Caesar VancePre-Sales SupportNew York#CV21 2.8%2011/12/12Low$106.450,00
Doris WilderSales AssistantSidney#BH23 5.6%2010/09/20High$85.600,00
Angelica RamosChief Executive Officer (CEO)Tata Co.#VC47 2.8%2009/10/09Low$1.200.000,00
Gavin JoyceDeveloperEdinburgh#TH42 9.8%2010/12/22Urgent$92.575,00
Jennifer ChangRegional DirectorSingapore#BN28 2.8%2010/11/14Urgent$357.650,00
Brenden WagnerSoftware EngineerGoogle Co.#CV28 2.8%2011/06/07Medium$206.850,00
Fiona GreenChief Operating Officer (COO)Infosys Ltd.#GF48 9.8%2010/03/11High$850.000,00
Shou ItouRegional MarketingTokyo#BF20 5.6%2011/08/14Low$163.000,00
Michelle HouseIntegration SpecialistSidney#DF37 2.8%2011/06/02High$95.400,00
Suki BurksDeveloperInfosys Ltd.#ER53 2.8%2009/10/22Urgent$114.500,00
Prescott BartlettTechnical AuthorTata Co.#DF27 5.6%2011/05/07Medium$145.000,00
Gavin CortezTeam LeaderGoogle Co.#SW22 5.6%2008/10/26Urgent$235.500,00
Martena MccrayPost-Sales supportEdinburgh#ED46 2.8%2011/03/09High$324.050,00
Unity ButlerMarketing DesignerInfosys Ltd.#ED47 9.8%2009/12/09High$85.675,00
Howard HatfieldOffice ManagerGoogle Co.#WS51 1.4%2008/12/16Medium$164.500,00
Hope FuentesSecretaryInfosys Ltd.#RG41 5.6%2010/02/12Low$109.850,00
Vivian HarrellFinancial ControllerInfosys Ltd.#TY62 2.8%2009/02/14Medium$452.500,00
Timothy MooneyOffice ManagerTata Co.#GH37 9.8%2008/12/11Low$136.200,00
Jackson BradshawDirectorNew York#YU65 2.8%2008/09/26High$645.750,00
Olivia LiangSupport EngineerSingapore#GH64 1.4%2011/02/03Medium$234.500,00
Bruno NashSoftware EngineerTata Co.#UY38 1.4%2011/05/03Medium$163.500,00
Sakura YamamotoSupport EngineerTokyo#RT37 1.4%2009/08/19Medium$139.575,00
Thor WaltonDeveloperNew York#WE61 1.4%2013/08/11Low$98.540,00
Finn CamachoSupport EngineerGoogle Co.#YU47 1.4%2009/07/07Low$87.500,00
Serge BaldwinData CoordinatorSingapore#QW64 1.4%2012/04/09High$138.575,00
Zenaida FrankSoftware EngineerNew York#WE63 1.4%2010/01/04High$125.250,00
Zorita SerranoSoftware EngineerGoogle Co.#ER56 1.4%2012/06/01Medium$115.000,00
Jennifer AcostaJunior Javascript DeveloperEdinburgh#RT43 2.8%2013/02/01Medium$75.650,00
Cara StevensSales AssistantNew York#TY46 2.5%2011/12/06High$145.600,00
Hermione ButlerRegional DirectorTata Co.#QA47 2.5%2011/03/21Medium$356.250,00
Lael GreerSystems AdministratorTata Co.#QS21 2.5%2009/02/27Medium$103.500,00
Jonas AlexanderDeveloperInfosys Ltd.#ED30 2.5%2010/07/14High$86.500,00
Shad DeckerRegional DirectorEdinburgh#SD51 2.5%2008/11/13Low$183.000,00
Michael BruceJavascript DeveloperSingapore#RF29 2.5%2011/06/27Low$183.000,00
Donna SniderCustomer SupportNew York#GD27 2.5%2011/01/25High$112.000,00
Employee NameJob DesignationCompany NameInvoice No.Credit/DebitDatePriorityBudgetAction

Custom filtering - range search

This example shows a search being performed on the age column in the data, based upon two inputs.
Minimum age:
Maximum age:
NamePositionOfficeAgeStart dateSalary
Tiger NixonSystem ArchitectEdinburgh612011/04/25$320,800
Garrett WintersAccountantTokyo632011/07/25$170,750
Ashton CoxJunior Technical AuthorSan Francisco662009/01/12$86,000
Cedric KellySenior Javascript DeveloperEdinburgh222012/03/29$433,060
Airi SatouAccountantTokyo332008/11/28$162,700
Brielle WilliamsonIntegration SpecialistNew York612012/12/02$372,000
Herrod ChandlerSales AssistantSan Francisco592012/08/06$137,500
Rhona DavidsonIntegration SpecialistTokyo552010/10/14$327,900
Colleen HurstJavascript DeveloperSan Francisco392009/09/15$205,500
Sonya FrostSoftware EngineerEdinburgh232008/12/13$103,600
Jena GainesOffice ManagerLondon302008/12/19$90,560
Quinn FlynnSupport LeadEdinburgh222013/03/03$342,000
Charde MarshallRegional DirectorSan Francisco362008/10/16$470,600
Haley KennedySenior Marketing DesignerLondon432012/12/18$313,500
Tatyana FitzpatrickRegional DirectorLondon192010/03/17$385,750
Michael SilvaMarketing DesignerLondon662012/11/27$198,500
Paul ByrdChief Financial Officer (CFO)New York642010/06/09$725,000
Gloria LittleSystems AdministratorNew York592009/04/10$237,500
Bradley GreerSoftware EngineerLondon412012/10/13$132,000
Dai RiosPersonnel LeadEdinburgh352012/09/26$217,500
Jenette CaldwellDevelopment LeadNew York302011/09/03$345,000
Yuri BerryChief Marketing Officer (CMO)New York402009/06/25$675,000
Caesar VancePre-Sales SupportNew York212011/12/12$106,450
Doris WilderSales AssistantSidney232010/09/20$85,600
Angelica RamosChief Executive Officer (CEO)London472009/10/09$1,200,000
Gavin JoyceDeveloperEdinburgh422010/12/22$92,575
Jennifer ChangRegional DirectorSingapore282010/11/14$357,650
Brenden WagnerSoftware EngineerSan Francisco282011/06/07$206,850
Fiona GreenChief Operating Officer (COO)San Francisco482010/03/11$850,000
Shou ItouRegional MarketingTokyo202011/08/14$163,000
Michelle HouseIntegration SpecialistSidney372011/06/02$95,400
Suki BurksDeveloperLondon532009/10/22$114,500
Prescott BartlettTechnical AuthorLondon272011/05/07$145,000
Gavin CortezTeam LeaderSan Francisco222008/10/26$235,500
Martena MccrayPost-Sales supportEdinburgh462011/03/09$324,050
Unity ButlerMarketing DesignerSan Francisco472009/12/09$85,675
Howard HatfieldOffice ManagerSan Francisco512008/12/16$164,500
Hope FuentesSecretarySan Francisco412010/02/12$109,850
Vivian HarrellFinancial ControllerSan Francisco622009/02/14$452,500
Timothy MooneyOffice ManagerLondon372008/12/11$136,200
Jackson BradshawDirectorNew York652008/09/26$645,750
Olivia LiangSupport EngineerSingapore642011/02/03$234,500
Bruno NashSoftware EngineerLondon382011/05/03$163,500
Sakura YamamotoSupport EngineerTokyo372009/08/19$139,575
Thor WaltonDeveloperNew York612013/08/11$98,540
Finn CamachoSupport EngineerSan Francisco472009/07/07$87,500
Serge BaldwinData CoordinatorSingapore642012/04/09$138,575
Zenaida FrankSoftware EngineerNew York632010/01/04$125,250
Zorita SerranoSoftware EngineerSan Francisco562012/06/01$115,000
Jennifer AcostaJunior Javascript DeveloperEdinburgh432013/02/01$75,650
Cara StevensSales AssistantNew York462011/12/06$145,600
Hermione ButlerRegional DirectorLondon472011/03/21$356,250
Lael GreerSystems AdministratorLondon212009/02/27$103,500
Jonas AlexanderDeveloperSan Francisco302010/07/14$86,500
Shad DeckerRegional DirectorEdinburgh512008/11/13$183,000
Michael BruceJavascript DeveloperSingapore292011/06/27$183,000
Donna SniderCustomer SupportNew York272011/01/25$112,000
NamePositionOfficeAgeStart dateSalary