jExcel v5 Examples

For us, the best way to learn is via examples. We bring in this section various examples from basic to advance applications.

  • Loading from a JSON object
    How to create a dynamic table from a JSON object.

  • Using tabs
    How to enable tabs on the online spreadsheet, so that users can add new worksheets.

  • Formulas on table footer
    Adding fixed formulas on the table footer.

  • Column filters
    How to enable column filters on a jExcel spreadsheet.

  • Spreadsheet as a webcomponent
    How to create a spreadsheet JavaScript webcomponent using jExcel.

  • React Implementation
    An example of how to integrate jExcel with React.

  • VUE Implementation
    An example of how to integrate jExcel with Vue.

  • Angular Implementation
    An example of how to integrate jExcel with Angular.

  • Jquery Implementation
    An example of how to integrate jExcel with jQuery.

  • Lazy loading
    An example of tackling large table datasets using jExcel Pro.

  • Search and pagination
    An example of utilizing search and pagination to tackle big datasets.

  • Column types
    Learn more about the powerful column types. This example demonstrates all native column types and how to create your own custom type.

  • Advanced dropdown
    Examples of how to handle simple, advanced, multiple, autocomplete, and conditional dropdowns. Learn how to add groups and images to your dropdown column type.

  • Date and datetime picker
    An example of basic to advanced calendar usage, date and datetime picker, valid date ranges, and conditional rendering.

  • Images
    An example of how to embed and upload images to your spreadsheet.

  • Email and Links
    Learn how to embed links and email to your spreadsheet.

  • Progressbar
    Include a progress bar column type in your spreadsheet to create a better visual experience for your applications.

  • Autonumber
    Learn how to use the autonumber column type in your spreadsheet to enhance the syncing of the spreadsheet data with databases, as well as date persistence.

  • HTML editor
    Learn how to allow users to include rich text to your spreadsheet using the new HTML editor column type.

  • Custom column type
    How to create custom column types using jExcel Pro.

  • Programmatically updates
    Learn how to apply changes to your table programmatically. Learn how to add, delete and move columns and rows, sorting, and other options.

  • Table Style
    Learn how to customize your JavaScript spreadsheet and bring a better visual experience to your applications.

  • Table Scripting
    Learn how to tackle conditional actions in your spreadsheet based on the available data within it.

  • Events
    Create rich and advanced spreadsheet behaviors using JavaScript events.

  • Importing data
    How to create a new spreadsheet based on different data sources, such as CSV, JSON, array, or XLSX files.

  • My first table
    Create a basic JavaScript spreadsheet.

  • Create a javascript spreadsheet from a CSV file
    How to create a JavaScript spreadsheet or data grid based on a CSV file.

  • Formulas
    Learn how to use jExcel-like formulas on your JavaScript tables.

  • Custom Formulas
    Unleash the power of your tables by bringing formulas and custom JavaScript methods to your jExcel spreadsheet.

  • Spreadsheet toolbars
    An example of how to enable or customize your JavaScript spreadsheet toolbar.

  • Column comments
    How to allow comments in your table spreadsheet.

  • Headers
    Enable nested headers in your spreadsheet and learn how to set or get header values.

  • Translations
    How to translate default messages from jExcel.

  • Meta information
    Manage hidden information about your cells using meta information methods. Learn how to set and reveal hidden information.

  • Merged cells
    An example of how to merge cells in your JavaScript tables.

  • Sorting columns
    An example of how to sort the table by columns via JavaScript.

  • Readonly Columns
    How to use readonly columns and cells. Learn how to programmatically change the readonly status of one cell.

  • Custom Contextmenu
    How to use and customize the spreadsheet contextmenu. Learn how to add custom actions to your spreadsheet.

  • Freeze columns
    Set up freeze columns in a jExcel JavaScript spreadsheet.

  • Create from a HTML table
    Create a jExcel table from a simple HTML table.

  • Dealing with remote IDs
    Learn how to manage and sync remote IDs of database records with your spreadsheets.

  • Data persistence
    Learn how data persistence can help you create exceptional online spreadsheets.

  • Including charts on your spreadsheets
    Learn how to include charts on your spreadsheets.