This page covers a non-latest version of Handsontable.
# Search
# Description
The search plugin provides an easy interface to search data across Handsontable.
In order to enable search mechanism, Options#search option must be set to true
.
Example
// as boolean
search: true
// as a object with one or more options
search: {
callback: myNewCallbackFunction,
queryMethod: myNewQueryMethod,
searchResultClass: 'customClass'
}
// Access to search plugin instance:
const searchPlugin = hot.getPlugin('search');
// Set callback programmatically:
searchPlugin.setCallback(myNewCallbackFunction);
// Set query method programmatically:
searchPlugin.setQueryMethod(myNewQueryMethod);
// Set search result cells class programmatically:
searchPlugin.setSearchResultClass(customClass);
# Options
# search
Source code (opens new window)search.search : boolean | object
The search
option configures the Search
plugin.
You can set the search
option to one of the following:
Setting | Description |
---|---|
false (default) | Disable the Search plugin |
true | Enable the Search plugin with the default configuration |
An object | - Enable the Search plugin- Apply your custom configuration |
If you set the search
option to an object, you can configure the following search options:
Option | Possible settings | Description |
---|---|---|
searchResultClass | A string | Add a custom CSS class name to search results |
queryMethod | A function | Add a custom query method |
callback | A function | Add a custom callback function |
Read more:
Default: false
Example
// enable the `Search` plugin with the default configuration
search: true,
// enable the `Search` plugin with a custom configuration
search: {
// add a `customClass` CSS class name to search results
searchResultClass: 'customClass',
// add a custom query method
queryMethod(queryStr, value) {
...
},
// add a custom callback function
callback(instance, row, column, value, result) {
...
}
}
# Methods
# destroy
Source code (opens new window)search.destroy()
Destroys the plugin instance.
# disablePlugin
Source code (opens new window)search.disablePlugin()
Disables the plugin functionality for this Handsontable instance.
# enablePlugin
Source code (opens new window)search.enablePlugin()
Enables the plugin functionality for this Handsontable instance.
# getCallback
Source code (opens new window)search.getCallback() ⇒ function
Gets the callback function.
Returns: function
- Return the callback function.
# getQueryMethod
Source code (opens new window)search.getQueryMethod() ⇒ function
Gets the query method function.
Returns: function
- Return the query method.
# getSearchResultClass
Source code (opens new window)search.getSearchResultClass() ⇒ string
Gets search result cells class name.
Returns: string
- Return the cell class name.
# isEnabled
Source code (opens new window)search.isEnabled() ⇒ boolean
Checks if the plugin is enabled in the handsontable settings. This method is executed in Hooks#beforeInit
hook and if it returns true
than the AutoRowSize#enablePlugin method is called.
# query
Source code (opens new window)search.query(queryStr, [callback], [queryMethod]) ⇒ Array<object>
Makes the query.
Param | Type | Description |
---|---|---|
queryStr | string | Value to be search. |
[callback] | function | optional Callback function performed on cells with values which matches to the searched query. |
[queryMethod] | function | optional Query function responsible for determining whether a query matches the value stored in a cell. |
Returns: Array<object>
- Return an array of objects with row
, col
, data
properties or empty array.
# setCallback
Source code (opens new window)search.setCallback(newCallback)
Sets the callback function. This function will be called during querying for each cell.
Param | Type | Description |
---|---|---|
newCallback | function | A callback function. |
# setQueryMethod
Source code (opens new window)search.setQueryMethod(newQueryMethod)
Sets the query method function. The function is responsible for determining whether a query matches the value stored in a cell.
Param | Type | Description |
---|---|---|
newQueryMethod | function | A function with specific match logic. |
# setSearchResultClass
Source code (opens new window)search.setSearchResultClass(newElementClass)
Sets search result cells class name. This class name will be added to each cell that belongs to the searched query.
Param | Type | Description |
---|---|---|
newElementClass | string | CSS class name. |
# updatePlugin
Source code (opens new window)search.updatePlugin()
Updates the plugin state. This method is executed when Core#updateSettings is invoked.