configureAsXhtmlTableElements

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

sxModule
(Required)
Type: Object
options
(Optional)
Type: Object
Properties