v4.21.2

Features

• Added i18n language support. (PT, NL) (#1665, #1680)

BugFixes

• Fixed an issue that text truncates when column width is auto (#1673)
• Fixed an issue where the context menu goes out of the viewport (#1682)
• Fixed an issue where data was truncated when pasting more rows than the number of rows in the grid (fix #1635) (#1685)

v4.21.1

Features

• Add removeRows API (#1658)

  grid.removeRows(rowKeys: RowKey[]): void

BugFixes

• Fixed an issue where row span using the row span attribute option would unravel when editing a cell (#1662)
• Fixed an issue where appended data was not appended to createdRows in modefiedData when using the appendRows API (#1657)

v4.21.0

Features

• Added feature to reset auto-sizing column widths in resetColumnWidths.

  • To refresh an auto-width column without setting the column width to a specific width, call the resetColumnWidths API without arguments.

• Added the feature that is instant applying of built-in editor.

  • It works only for built-in select, checkbox(radio), datePicker editor.
  • For use this, pass the instantApply option to true in property of options of editor of column.
  • If use it, apply new value by clicking a new value in the dropdown layer of built-in editor.

    const grid = new tui.Grid({
      columns: [
        {
          // ...
          editor: {
            type: 'select',
            options: {
              listItems: /* ... */,
              instantApply: true
            }
          }
        },
      ]
    });

  • Before use it
    
  • After use it
    

Bugfixes

• Fixed an error where the dynamic row span did not work properly when scrolling.
• Fixed an issue that occurs an error when finished editing by clicking the other side.

v4.20.3

Bugfixes

• Fixed that destroyed the editor before editing was finished

v4.20.1

Features

• Added option to set tree grid indent width (#1538)

  const grid = new tui.Grid({
  // ...
  treeColumnOptions: {
    // ...
    indentWidth: 50
    },
  // ...
  });

• Added APIs that return added class names (#1561)
  Column

  getColumnClassNames(columnName: string): string[]

  Row

  getRowClassNames(rowKey: number | string): string[]

  Cell

  getCellClassNames(rowKey: number | string, columnName: string): string[]

  In the case of a cell, the class name added to the column and row to which the cell corresponds is also returned.
  In the case of a column, only the class names added to the column in all rows are returned.

Bugfixes

• Fixed that where the summary calculated incorrectly when using the keyboard (#1536)
• Fixed that where dropdown layer in the editor did not move when scrolling (#1542)
• Fixed that dropdown layer in the editor not disappearing (#1545)
• Fixed to the validation works when only data modified (#1559)

Documents

• Corrected incorrect default values for options (fix #1449) (#1503)
• Fixed an issue where options were passed incorrectly in the filter example (fix #1452) (#1502)

v4.20.0

Features

• Added feature to export filtered data (fix #1459) (#1513)

  getFilteredData():

• Added feature to click consecutive row checkboxes with Shift + Click (#1512)
  
• Added feature to disable context menu (fix #1432) (#1515
  • If disable the context menu, the browser default context menu appears when right-click.

  const grid = Grid({
    // ...
    contextMenu: null
    // ...
  });

  
• Added feature to column drag and drop (fix #1483) (#1523)
  • Click the column header what want to move and drag it to the grid body to start column D&D.
  • When start a column dnd, a floating layer for that column header is created in the header area.
  • If there is complex columns or a hidden column, the column D&D is disabled.
  • If the column to be moved or the column of the destination is a row header column or a tree column, column D&D cannot be performed.

  const grid = new tui.Grid({
    // ...
    draggable: true,
    // ...
  });

  • Column D&D
    
  • Row header column D&D
    
  • Tree column D&D
    
• Added API to return specific column model (#1531)

  getColumn(columnName: string): ColumnInfo | null;

• Added feature to enable/disable specific cell (#1530)
  • If that the cell is in a row number or draggable column, It is not work.

  disableCell(rowKey: RowKey, columnName: string): void
  enableCell(rowKey: RowKey, columnName: string): void

  • Disable cell
    
  • Enable cell
    
• Added feature that dynamic rowspan (#1535)
  • Can apply a dynamic rowspan to a column by passing an option in the form below.

  const grid = new Grid({
    // ...,
    columns: [
        {
          header: 'Name',
          name: 'name',
          rowSpan: true
        },
        {
          header: 'Artist',
          name: 'artist',
          rowSpan: true
        }
      ],
    // ...
  });

  • Default
    • Row span is applied to the selected column when creating the grid.
    
  • Filter
    • When applying a filter, the row span is reapplied to the changed data.
      
  • D&D
    • Reset all row spans at the start of dragging, and then reapplys the rowspans when dropping.
      
  • Sort
    • Reapplies rowspan to changed data when sorting.
      
  • Pagination
    • If the pages are different, a separate rowspan is applied even if the subsequent values are the same.
      
  • Edit
    • If the cell value changes, the row span is reapplied accordingly.
    • If you change the cell value to which the rowspan is applied, only the cell value of the top row among the rows bounded by the rowspan is changed.
      
  • Realtion columns
    • Dynamic rowspan is not applied to sub-columns except for the column in the top-level relation within the column relation.
    
  • Tree
    • For tree data, row span is not applied.

Bugfixes

• Fixed a problem that was submitted when a button in the grid inside the Form element was clicked (fix #1528) #1529

v4.19.4

Bugfixes

• Fixed to allow exporting as formatted values (#1499)
• Fixed to export in UTF-8 format when exporting csv (fix #1495) (#1501)
• Fixed a script error that occurred in incognito mode (fix #1450) (#1500)

Documents

• Corrected incorrect default values for options (fix #1449) (#1503)
• Fixed an issue where options were passed incorrectly in the filter example (fix #1452) (#1502)

v4.19.3

Bugfixes

• Fixed that the floatingRow shows incompletely for multiple rows (#1477)
• Fixed that to disable context menu on dummy cells (fix #1463) (#1490)
• Fixed that the wrong rowHeight after DnD (fix #1438) (#1489)
• Fixed that the editing occurs error after filter (fix #1456) (#1487)
• Fixed that incorrect type definition (#1494)
• Fixed that the tree button not to submit (fix #1476) (#1492)
• Fixed that to remove editing layer when filter button clicked (#1493)

v4.19.2

Bugfixes

• Fixed that the grid body is hidden after resizing the grid.(#1475)
• Fixed that the wrong tree rowKey is generated in case of multi grid instance.(#1478)

v4.19.1

Bugfixes

Fixed wrong external dependency module(SheetJS) name.(#1467)