features
Menu
Menu

Exporting Data

ZingGrid has a default set of export features through getData(), as well as other customizable export features through our API.

For all the demos on this page check your console for exported output.

On This Page

Data

Use the getData() method to retrieve data.
Edit
Download
CloseCopy Copied
CloseCopy Copied
CloseCopy Copied

CSV

Use the getData({csv:true}) method to retrieve data.
Edit
Download
CloseCopy Copied
CloseCopy Copied
CloseCopy Copied

Include Header Info

Use the getData({headers:true}) method to retrieve data.
Edit
Download
CloseCopy Copied
CloseCopy Copied
CloseCopy Copied

Include Visible Columns

Use the getData({cols:true}) method to retrieve data.

Add the columns-controls attribute to add the menu for manually toggling column visibility. You can also hide columns by default with the hidden attribute.

CloseCopy Copied
<zing-grid
  columns-controls>
  <zg-colgroup>
    <zg-column index="year" hidden></zg-column>
  </zg-colgroup>
</zing-grid>
Edit
Download
CloseCopy Copied
CloseCopy Copied
CloseCopy Copied

Include Visible Rows

Use the getData({rows:true}) method to retrieve data.
Edit
Download
CloseCopy Copied
CloseCopy Copied
CloseCopy Copied

Selected

You can also use API eventgrid:select to grab data when dragging and highlighting.
Edit
Download
CloseCopy Copied
CloseCopy Copied
CloseCopy Copied

Papaparse Demo

You can use third party resources to export your grid data as well.
Edit
Download
CloseCopy Copied
CloseCopy Copied
CloseCopy Copied

Related Resources

Join the Community

Support, extra demos, pre-releases and more

loadingloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloadBgloading