Build applications

Input Grids

In this course, you’ll learn how to create and configure Input Grid controls in Inline and Form-based modes. Inline Input Grids work like traditional data…

Start course
Lessons
11
Level
Intermediate
Format
Self-paced
Course contents11 lessons
Course overview
  1. 01Headers
  2. 02Responsive
  3. 03Pagination
  4. 04Copy and Paste
  5. 05Text Masks
  6. 06Formatting – Metadata
  7. 07Hide Columns
  8. 08Hide/Disable Rows
  9. 09Column Widths
  10. 10Form-based Input Grids
  11. 11Grid Alignment

In this course, you’ll learn how to create and configure Input Grid controls in Inline and Form-based modes. Inline Input Grids work like traditional data tables in the sense that they allow copying data to and from other sources, and can display a large amount of data in a small area. Applications with mobile use should use Form-based Grids instead. You can use formulas to dynamically control the layout of Input Grids.

Requirements

  • A SpreadsheetWeb Control Panel account. You can signup for a trial account here.
  • Your spreadsheet containing named ranges for all inputs and outputs you would like to use in the web interface of your application.

Course curriculum

What you’ll learn

  1. 01
    HeadersYou can change the header title of an inline input grid by clicking that column under the Table Named Range Columns section, and editing the Title property.…
  2. 02
    ResponsiveConfigure an inline input grid to collapse columns on narrow screens, expose hidden row values with expandable details, or wrap content instead.
  3. 03
    PaginationEnable pagination for large inline input grids to improve initial loading and copy-and-paste performance while preserving selections across pages.
  4. 04
    Copy and PasteWhen copying data from clipboard into an input grid, simply click on the cell where you want the first piece of the data to be placed, and then press the…
  5. 05
    Text MasksYou can format the values displayed in input grid columns using the masks feature. Please note that this property will only be available if the Use Metadata…
  6. 06
    Formatting – MetadataWhen Use Metadata Formatting option is enabled, any column-based formatting will be replaced with the formatting information coming from your workbook. This…
  7. 07
    Hide ColumnsYou can set the visibility of individual columns in an input grid by selecting that column in the grid options in the user interface designer, and selecting…
  8. 08
    Hide/Disable RowsGrid controls in SpreadsheetWEB are managed on a column by column basis, and because of this, you need a separate “helper” column to manipulate individual…
  9. 09
    Column WidthsBy default, the system will determine the width of each column in an input grid dynamically based on its contents. You can control the size of the columns…
  10. 10
    Form-based Input GridsFormula based input grids differ from inline grids in how data is entered into the table. To change the input grid type, select the input grid in the user…
  11. 11
    Grid AlignmentDefault Alignment: When you create a new grid control (for input or output), the default alignment for the entire grid is set to left. However, this can be…