Return the debug info about this component.
Disable the component. Normally this means that the component will not execute handlers for the framework events (query events, for example). Components are enabled by default on creation.
Enable the component. Normally this means that the component will execute handlers for the framework events (query events, for example). Components are enabled by default on creation.
Return the bindings, or environment, for the current component.
Gets the HTMLElement associated to a cell.
The row number of the cell.
The column number of the cell.
The associated HTMLElement.
Gets the string associated to a cell.
The row number of the cell.
The column number of the cell.
The associated string.
Returns the currently selected column value.
Returns the currently selected row value.
Selects a cell by its row and column number. Does not execute a query.
The row number of the cell to select.
The column number of the cell to select.
Get the bound component to the given HTMLElement. Throws an assert if the HTMLElement has no component bound, unless using the noThrow argument.
If there is multiple component bound to the current HTMLElement, you must specify the component class.
HTMLElement for which to get the bound component.
Optional component class. If the HTMLElement has multiple components bound, you must specify which one you are targeting.
Boolean option to tell the method to not throw on error.
Allows the component to bind events and execute them only when it is enabled.
Contains the state of options for different components. Mainly used by ResultLink.
Contains the state of different components (enabled vs disabled). Allows to get/set values. Triggers component state event when modified. Each component can listen to those events.
Holds the data for the Matrix.
A disabled component will not participate in the query, or listen to ComponentEvents.
Allows component to log in the dev console.
Contains the singleton that allows to trigger queries.
Contains the state of the query. Allows to get/set values. Trigger query state event when modified. Each component can listen to those events.
A reference to the root HTMLElement (the SearchInterface).
A reference to the root of every component, the SearchInterface.
The currently selected column value, or undefined
if nothing is selected.
The currently selected row value, or undefined
if nothing is selected.
The static ID that each component needs in order to be identified.
For example, SearchButton -> static ID: SearchButton -> className: CoveoSearchButton
A reference to the Analytics.client.
Specifies the font-size to use for displaying text inside the cells.
This option is mainly useful to prevent a Matrix containing many columns from cropping some of its values.
However, instead of using this option to solve this kind of issue, you could also remove some of the less important columns from your Matrix or modify the CSS of your page to allow the Matrix to occupy a larger space.
Default value is ''
.
data-cell-font-size='foo'
Specifies the field to use for the columns.
Specifying a value for this options is required for this component to work.
data-column-field='@foo'
Specifies the field values to use for each column.
See also Matrix.options.columnLabels.
Default value is []
, which means that the Matrix will not generate any column (except the Total column, if
Matrix.options.enableRowTotals is true
).
Specifies the label for the first column on the left as a description of the Matrix.options.columnField.
Default value is undefined
.
data-column-header='foo'
Specifies the label values to use for each column.
Default value is []
. The array set for this options should match the Matrix.options.columnFieldValues.
Specifies the field whose computed values you want to display in the cells.
Specifying a value for this options is required for this component to work.
data-computed-field='@foo'
Specifies how to format the values resulting from a Matrix.options.computedFieldOperation.
The Globalize library defines all available formats (see Globalize).
The most commonly used formats are:
c0
- Formats the value as a currency.n0
- Formats the value as an integer.n2
- Formats the value as a floating point with 2 decimal digits.Default value is c0
.
data-computed-field-format='foo'
Specifies the type of aggregate operation to perform on the Matrix.options.computedField.
The possible values are:
sum
- Computes the sum of the computed field values.average
- Computes the average of the computed field values.minimum
- Finds the minimum value of the computed field values.maximum
- Finds the maximum value of the computed field values.Default value is sum
.
data-computed-field-operation='foo'
Specifies whether to add a Total row containing the total of each column.
Default value is true
data-enable-column-totals='true' data-enable-column-totals='false'
Specifies whether to show a preview popup of cell results when hovering over a cell.
See also Matrix.options.previewSortCriteria, Matrix.options.previewMaxWidth, Matrix.options.previewMinWidth, Matrix.options.previewDelay and Matrix.options.previewTemplate.
Default value is true
.
data-enable-hover-preview='true' data-enable-hover-preview='false'
Specifies whether to display a Total column containing the sum of each row.
Default value is true
.
data-enable-row-totals='true' data-enable-row-totals='false'
Specifies the maximum number of rows to display in the Matrix.
Default value is 10
. Minimum value is 0
.
data-maximum-number-of-rows='10'
Specifies the maximum number of results to include in the IGroupByRequest for the columns.
This value should always be greater than the Matrix.options.maximumNumberOfRows. If it is too small, some of the results will not be displayed in the Matrix.
Default value is 100
. Minimum value is 0
.
data-maximum-number-of-values-in-group-by='10'
If Matrix.options.enableHoverPreview is true
, specifies the delay (in milliseconds) before sending the
query to get the preview results.
Default value is 500
.
data-preview-delay='10'
If Matrix.options.enableHoverPreview is true
, specifies the maximum width (in pixels) of the preview
popup.
Default value is 500px
.
data-preview-max-width='foo'
If Matrix.options.enableHoverPreview is true
, specifies the minimum width (in pixels) of the preview
popup.
Default value is 0
.
data-preview-min-width='foo'
If Matrix.options.enableHoverPreview is true
, specifies the criteria to use for sorting the results of
the hover preview.
The available sort criteria values are the same as those of the IQuery.
The possible values are:
relevancy
: Uses all configured ranking weights and any specified ranking expressions to sort the results.dateascending
/ datedescending
: Sorts the results using the @date
field value, which is typically the
last modification date of an item in the index.qre
: Sorts the results using only the weights applied by ranking expressions. Using qre
is much like using
relevancy
, except that qre
does not compute automatic weights, such as weights based on keyword proximity.nosort
: Does not sort the results. Using nosort
returns the items in an essentially random order.fieldascending
/ fielddescending
: Sorts the results using the value of a custom field.fieldascending
/ fielddescending
: Sorts the results using the value of a custom field.See also Matrix.options.previewSortField.
Default value is FieldDescending
.
data-preview-sort-criteria='foo'
If Matrix.options.previewSortCriteria is fieldascending
or fielddescending
, specifies the field to
use for sorting the results of the hover preview.
Default value is the value of Matrix.options.computedField.
data-preview-sort-field='@foo'
If Matrix.options.enableHoverPreview is true
, specifies the template ID or CSS selector of the template
to use to render the results of the hover preview.
You must use either data-template-id
or data-template-selector
in the markup to specify a value for this
option.
Examples:
Specifying what template to use by referring to its template ID:
<div class='CoveoMatrix' data-template-id='TemplateId'></div>
Specifying what template to use by referring to its CSS selector:
<div class='CoveoMatrix' data-template-selector='.templateSelector'></div>
Specifies the field to use for the rows.
Specifying a value for this options is required for this component to work.
data-row-field='@foo'
Specifies the criteria to use for sorting the rows.
See IGroupByRequest.sortCriteria for the list of possible values.
Default value is computedfielddescending
.
data-sort-criteria='foo'
Specifies the text to display at the top of the Matrix.
data-title='foo'
Creates a new Matrix. Also verifies whether options are valid and coherent. Binds query events.
The HTMLElement on which to instantiate the component.
The options for the Matrix component.
The bindings that the component requires to function normally. If not set, these will be automatically resolved (with a slower execution time).
The Matrix component uses the values of two fields (row and column) to display the results of the specified computed field in a table.
The user specifies the values to use for the columns. An IGroupByRequest operation performed at the same time as the main query retrieves the values to use for the rows.
In a way that is similar to the Facet component, selecting a Matrix cell allows the end user to drill down inside the results by restricting the row field and the column field to match the values of the selected cell.
Coveo for Salesforce Free