configure As Xhtml Table Elements
Type: Function
How to get configureAsXhtmlTableElements?
JavaScript
import configureAsXhtmlTableElements from 'fontoxml-table-flow-xhtml/src/configureAsXhtmlTableElements.js'
Configure XHTML tables.
Note that the columnBefore
widget area can only be used if your tables use col elements, i.e., when shouldCreateColumnSpecificationNodes
is set to true
.
Example usage for the table widgets:
Other
configureAsXhtmlTableElements(sxModule, {
table: {
namespaceURI: 'http://docbook.org/ns/docbook',
tableFilterSelector: 'self::table and not(tgroup)'
},
td: {
defaultTextContainer: 'simpara'
}
columnBefore: [
createIconWidget('clock-o', {
clickOperation: 'lcTime-value-edit',
tooltipContent: 'Click here to edit the duration'
})
],
rowBefore: [
createIconWidget('dot-circle-o', {
clickOperation: 'do-nothing'
})
],
showInsertionWidget: true,
showHighlightingWidget: true,
columnWidgetMenuOperations: [
{
contents: [
{ name: 'contextual-xhtml-set-cell-horizontal-alignment-left' },
{ name: 'contextual-xhtml-set-cell-horizontal-alignment-center' },
{ name: 'contextual-xhtml-set-cell-horizontal-alignment-right' },
{ name: 'contextual-xhtml-set-cell-horizontal-alignment-justify' }
]
},
{
contents: [
{ name: 'contextual-xhtml-set-cell-vertical-alignment-top' },
{ name: 'contextual-xhtml-set-cell-vertical-alignment-center' },
{ name: 'contextual-xhtml-set-cell-vertical-alignment-bottom' }
]
},
{ contents: [{ name: 'column-delete-at-index' }] }
],
rowWidgetMenuOperations: [
{
contents: [
{ name: 'contextual-xhtml-set-cell-horizontal-alignment-left' },
{ name: 'contextual-xhtml-set-cell-horizontal-alignment-center' },
{ name: 'contextual-xhtml-set-cell-horizontal-alignment-right' },
{ name: 'contextual-xhtml-set-cell-horizontal-alignment-justify' }
]
},
{
contents: [
{ name: 'contextual-xhtml-set-cell-vertical-alignment-top' },
{ name: 'contextual-xhtml-set-cell-vertical-alignment-center' },
{ name: 'contextual-xhtml-set-cell-vertical-alignment-bottom' }
]
},
{ contents: [{ name: 'contextual-row-delete' }] }
],
cellStylingTranslationQuery: 'import module namespace app = "http://www.fontoxml.com/app"; app:cellStylingTranslationQuery(., $tableEdges)'
});
The cell element menu button widgets are added based on the existence of contextual operations on cell level. Make sure that only cell-specific operations are added to the cell widget, so that users are only given options relevant to them. Example on how you can add this element menu on the widget:
Other
configureProperties(sxModule, 'self::td', {
contextualOperations: [
{ name: 'contextual-set-total-cell', hideIn: ['context-menu'] }
]
});
XHTML tables can also be configured to be collapsible. Refer to our guide to learn more.
Arguments
sx
Module (Required)
Type: Object
options
(Optional)
Type: Object
Properties