Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]General Information
[Expand]WinForms Controls
[Collapse]ASP.NET Controls and MVC Extensions
 [Expand]Prerequisites
 [Expand]What's Installed
 [Expand]Common Concepts
 [Collapse]ASP.NET WebForms Controls
  [Expand]Reporting
  [Expand]Chart Control
  [Expand]Grid View
  [Expand]Card View
  [Expand]Vertical Grid
  [Expand]Spreadsheet
  [Collapse]Rich Text Editor
   [Expand]Product Information
   [Collapse]Concepts
     ASPxRichEdit Control
    [Collapse]Document
     [Collapse]Document Model
       Sub-Document
       Text Content (Text Buffer)
       Characters
       Paragraphs
       Inline Pictures
       Hyperlinks and Bookmarks
       Tables
       Sections
       Headers and Footers
       Document Fields
       Floating Objects
       Document Protection
      Document Layout
     Supported Document Formats
     Import and Export
     Formatting Characters
     Formatting Paragraphs
    [Expand]Fields
     Mail Merge
     Restrictions
     Spell Checking
    [Expand]Client API
    [Expand]Built-in Dialogs
     HTML Tag Interpretation
     Keyboard Shortcuts
   [Expand]Examples
  [Expand]Image and Data Browsing
  [Expand]Docking and Popups
  [Expand]Site Navigation and Layout
  [Expand]File Management
  [Expand]Multi-Use Site Controls
  [Expand]Scheduler
  [Expand]HTML Editor
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Gauges
  [Expand]Data Editors
  [Expand]Spell Checker
  [Expand]Query Builder
 [Expand]ASP.NET MVC Extensions
 [Expand]Localization
 [Expand]Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Document Server
[Expand]Reporting
[Expand]Report Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Tables

Expanded Overview

A table is an abstract type of block-level content in a document. A table is a set of paragraphs arranged in rows and columns. In a sub-document, the information about existing tables is stored within a specific table list. A table's textual contents (paragraphs) are maintained within the sub-document's text buffer.

Expanded Definition

A table is a logical unit that contains child elements (rows and cells), defines element-specific formatting settings and specifies the text buffer intervals to which these settings should be applied. Programmatically, a table is implemented as the Table client object. A list of table objects in the active sub-document can be accessed through the tablesInfo client property (SubDocument.tablesInfo) in the following notation:
clientRichEditName.document.activeSubDocument.tablesInfo

A table maintains a list of table rows. Each row, in its turn, maintains a list of its cells. A table and all its child elements (rows and cells) have their own positions within the text buffer of a sub-document. A table's start position equals the start position of the first cell within the table's first row.

A table can be defined using the following characteristics.

Note

The RichEdit processes all tables as tables of a fixed width. A fixed width table is not dynamically resized based on its contents. The final width of cells in a fixed width table depends only on the table preferred width and the cell preferred width, and does not depend on the cell content. As a result, the display of tables in the RichEdit can differ between tables of the XtraRichEdit and Microsoft Word.

Expanded ClientAPI

Expanded Tables

The following client commands are available for manipulating tables and their settings. Call the commands in the notation given below:
clientRichEditName.commands.commandName.execute(parameter_if_any)

Command Name Link Description
changeTableBorderRepositoryItem RichEditCommands.changeTableBorderRepositoryItem Gets a command to apply borders' drawing settings.
changeTableBordersAndShading RichEditCommands.changeTableBordersAndShading Gets a command to change the selected table's borders and shading.
changeTableFormatting RichEditCommands.changeTableFormatting Gets a command to change the selected table's formatting.
changeTableLook RichEditCommands.changeTableLook Gets a command to change the selected table's style options.
changeTableStyle RichEditCommands.changeTableStyle Gets a command to change the selected table's style.
deleteTable RichEditCommands.deleteTable Gets a command to delete the selected table.
insertTable RichEditCommands.insertTable Gets a command to insert a rectangular table of the specified size.
showTableGridLines RichEditCommands.showTableGridLines Gets a command to toggle the display of grid lines for a table with no borders applied - on/off.
toggleTableCellInsideHorizontalBorders RichEditCommands.toggleTableCellInsideHorizontalBorders Gets a command to apply (or cancel) border settings of the inside horizontal borders for the selected cells.
toggleTableCellInsideVerticalBorders RichEditCommands.toggleTableCellInsideVerticalBorders Gets a command to apply (or cancel) border settings of the inside vertical borders for the selected cells.
toggleTableCellOutsideBorders RichEditCommands.toggleTableCellOutsideBorders Gets a command to apply (or cancel) border settings of the outside borders for the selected cells.

Expanded Rows

The following client commands are available for manipulating table rows. Call the commands in the notation given below:
clientRichEditName.commands.commandName.execute(parameter_if_any)

Command Name Link Description
changeTableRowPreferredHeight RichEditCommands.changeTableRowPreferredHeight Gets a command to change the selected table rows' preferred height.
deleteTableRows RichEditCommands.deleteTableRows Gets a command to delete the selected rows in the table.
insertTableRowAbove RichEditCommands.insertTableRowAbove Gets a command to insert a row in the table above the selected row.
insertTableRowBelow RichEditCommands.insertTableRowBelow Gets a command to insert a row in the table below the selected row.

Expanded Cells

The following client commands are available for manipulating table cells and their settings. Call the commands in the notation given below:
clientRichEditName.commands.commandName.execute(parameter_if_any)

Expanded Insert

Command Name Link Description
insertTableCellsWithShiftToTheVertically RichEditCommands.insertTableCellsWithShiftToTheVertically Gets a command to insert table cells with a vertical shift into the selected table.
insertTableCellWithShiftToTheLeft RichEditCommands.insertTableCellWithShiftToTheLeft Gets a command to insert table cells with a horizontal shift into the selected table.
insertTableColumnToTheLeft RichEditCommands.insertTableColumnToTheLeft Gets a command to insert a table column to the left of the current position in the table.
insertTableColumnToTheRight RichEditCommands.insertTableColumnToTheRight Gets a command to insert a table column to the right of the current position in the table.

Expanded Delete

Command Name Link Description
deleteTableCellsWithShiftHorizontally RichEditCommands.deleteTableCellsWithShiftHorizontally Gets a command to delete the selected table cells with a horizontal shift.
deleteTableCellsWithShiftVertically RichEditCommands.deleteTableCellsWithShiftVertically Gets a command to delete the selected table cells with a vertical shift.
deleteTableColumns RichEditCommands.deleteTableColumns Gets a command to delete the selected columns in the table.

Expanded Formatting Properties

Command Name Link Description
changeTableCellFormatting RichEditCommands.changeTableCellFormatting Gets a command to change the cell formatting of the selected table elements.
changeTableCellPreferredWidth RichEditCommands.changeTableCellPreferredWidth Gets a command to change the preferred cell width of the selected table rows.
changeTableCellShading RichEditCommands.changeTableCellShading Gets a command to change cell shading in selected table cells.
changeTableColumnPreferredWidth RichEditCommands.changeTableColumnPreferredWidth Gets a command to change the selected table columns' preferred width.
mergeTableCells RichEditCommands.mergeTableCells Gets a command to merge the selected cells.
splitTableCells RichEditCommands.splitTableCells Gets a command to split the selected table cells.

Expanded Alignment

Command Name Link Description
toggleTableCellAlignBottomCenter RichEditCommands.toggleTableCellAlignBottomCenter Gets a command to apply bottom-center alignment for the selected cells.
toggleTableCellAlignBottomLeft RichEditCommands.toggleTableCellAlignBottomLeft Gets a command to apply bottom-left alignment for the selected cells.
toggleTableCellAlignBottomRight RichEditCommands.toggleTableCellAlignBottomRight Gets a command to apply bottom-right alignment for the selected cells.
toggleTableCellAlignMiddleCenter RichEditCommands.toggleTableCellAlignMiddleCenter Gets a command to apply middle-center alignment for the selected cells.
toggleTableCellAlignMiddleLeft RichEditCommands.toggleTableCellAlignMiddleLeft Gets a command to apply middle-left alignment for the selected cells.
toggleTableCellAlignMiddleRight RichEditCommands.toggleTableCellAlignMiddleRight Gets a command to apply middle-right alignment for the selected cells.
toggleTableCellAlignTopCenter RichEditCommands.toggleTableCellAlignTopCenter Gets a command to apply top-center alignment for the selected cells.
toggleTableCellAlignTopLeft RichEditCommands.toggleTableCellAlignTopLeft Gets a command to apply top-left alignment for the selected cells.
toggleTableCellAlignTopRight RichEditCommands.toggleTableCellAlignTopRight Gets a command to apply top-right alignment for the selected cells.

Expanded Borders

Command Name Link Description
removeTableCellBorders RichEditCommands.removeTableCellBorders Gets a command to remove the borders of the selected table cells.
toggleTableCellAllBorders RichEditCommands.toggleTableCellAllBorders Gets a command to apply (or cancel) border settings to all borders of the selected cells.
toggleTableCellBottomBorder RichEditCommands.toggleTableCellBottomBorder Gets a command to apply (or cancel) border settings of the bottom border for the selected cells.
toggleTableCellInsideBorders RichEditCommands.toggleTableCellInsideBorders Gets a command to apply (or cancel) border settings of the inside borders for the selected cells.
toggleTableCellLeftBorder RichEditCommands.toggleTableCellLeftBorder Gets a command to apply (or cancel) border settings of the left border for the selected cells.
toggleTableCellRightBorder RichEditCommands.toggleTableCellRightBorder Gets a command to apply (or cancel) border settings of the right border for the selected cells.
toggleTableCellTopBorder RichEditCommands.toggleTableCellTopBorder Gets a command to apply (or cancel) border settings of the top border for the selected cells.

Expanded Dialogs

The following client commands are available for opening table-specific dialogs. Call the commands in the notation given below:
clientRichEditName.commands.commandName.execute(parameter_if_any)

Command Name Link Description
deleteTableCellsDialog RichEditCommands.deleteTableCellsDialog Gets a command to invoke the Delete Cells dialog window.
insertTableCellsDialog RichEditCommands.insertTableCellsDialog Gets a command to invoke the Insert Cells dialog window.
openInsertTableDialog RichEditCommands.openInsertTableDialog Gets a command to invoke the Insert Table dialog window.
openTableBordersAndShadingDialog RichEditCommands.openTableBordersAndShadingDialog Gets a command to invoke the Borders tab of the Borders and Shading dialog window.
openTableFormattingDialog RichEditCommands.openTableFormattingDialog Gets a command to invoke the Table tab of the Table Properties dialog window.
splitTableCellsDialog RichEditCommands.splitTableCellsDialog Gets a command to invoke the Split Cells dialog window.

Expanded Table Styles

Using a table style allows setting common formatting properties of multiple tables at once. A table style contains settings that affect character properties, paragraph properties, cell properties, row properties and table properties.

A list of table styles can be accessed using the following tableStylesInfo property in the notation given below:
clientRichEditName.document.tableStylesInfo

Property Name Link Description
tableStylesInfo RichEditDocument.tableStylesInfo Provides information about table styles in the current document.

To apply a table style (TableStyle) to the text, use the following changeTableStyle client command in the notation given below:
clientRichEditName.commands.changeTableStyle(parameter_if_any)

Command Name Link Description
changeTableStyle RichEditCommands.changeTableStyle Gets a command to change the selected table's style.

To apply a table look (TableLookSettings) to a table, use the following changeTableLook client command in the notation given below:
clientRichEditName.commands.changeTableLook(parameter_if_any)

Command Name Link Description
changeTableLook RichEditCommands.changeTableLook Gets a command to change the selected table's style options.

Expanded Manipulation Through UI

The ASPxRichEdit control provides support for complex tables, as well as nested ones. An end-user can insert tables, edit a table layout by splitting and merging cells, and insert rows and columns. Borders and shading can be applied individually for each cell in a table.

An end-user can easily insert a table using the dropdown window of the Table ribbon button located in the ribbon's Insert tab in the Tables group.

 

The RichEdit provides a set of ribbon commands to work with tables. These commands are available through two specific ribbon context tabs - Design and Layout.

The Design tab provides end-users with the ability to set borders, border color and cell shading.

 

The Layout tab allows you to perform complex table element operations, such as merging cells, inserting and deleting rows and columns, and defining the properties of all main table elements.

 

End users can change table settings and table layout using Table Dialogs.

How would you rate this topic?​​​​​​​