# new DataComponent(config) → {HTMLElement}
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
config |
object
|
||
collection |
object
|
<optional> |
Optional collection. If not provied, creates a new collection from the model |
model |
object
|
<optional> |
Optional model. If not provided, uses the collection's model |
Methods
# async _updateToolbar()
Reload the toolbar, if any In the generic case, the toolbar is a set of buttons that can be hidden or shown according to its settings. For now, we only manage the "create" button.
# async createRecord(model)
Open the form to create a new record
Important: this method must be overriden in the instanced component
Parameters:
Name | Type | Description |
---|---|---|
model |
object
|
Model to create the record |
# async export()
Export records as XLS or JSON
# async ftsearch(value)
Full-text search on all text fields
Parameters:
Name | Type | Description |
---|---|---|
value |
string
|
# getColumn(fieldId) → {object}
Get the column config used to display a field
Parameters:
Name | Type | Description |
---|---|---|
fieldId |
string
|
The column config
object
# getFields() → {Array.<object>}
Get the view fields.
Note: in a some view (like datatables), fields are the same thing as columns.
Array of column definitions
Array.<object>
# getLocalConfig() → {object}
When a view configuration can't be persisted into db, it can be stored and retrieved from the local storage
The view configuration stored locally
object
# getSelection() → {Array.<string>}
Get the selected records
The list of selected record ids
Array.<string>
# groupBy(groupFields)
Group by a list of fields
Parameters:
Name | Type | Description |
---|---|---|
groupFields |
Array.<string>
|
List of field names (not ids) |
Example
myDatatable.groupBy(["Country", "City", "Age"])
# hideSearchBar()
Reset the search made from the search bar
# async reload()
Reload the component's data and re-render it
# async resetLocalViewParameters()
Reset all local component parameters:
- collection configurations (sort, filter, group)
- columns configuration (visibility, width, colors, aggregation)
When the component's configuration is persisted into local storage, it's useful to be able to reset it
this
# resetSearchBar()
Reset the search made from the search bar
# async selectRecord(record)
Show a single record
Important: this method must be overriden in the instanced component
Parameters:
Name | Type | Description |
---|---|---|
record |
object
|
Record to show |
# async selectRecordById(recordId)
Show a single record (passing its id)
Parameters:
Name | Type | Description |
---|---|---|
recordId |
string
|
id of the record to show |
# showFieldsWindow(xopt, Yopt, coloropt)
Show a modal window to select / deselect fields
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
x |
number
|
<optional> |
x coordinate |
Y |
number
|
<optional> |
y coordinate |
color |
string
|
<optional> |
Window color, in hexa: "#00aaee" |
# showFilterWindow(xopt, Yopt, coloropt)
Show a modal window to filter data
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
x |
number
|
<optional> |
x coordinate |
Y |
number
|
<optional> |
y coordinate |
color |
string
|
<optional> |
Window color, in hexa: "#00aaee" |
# showMobileSearchBar()
Show the mobile search bar
# showSortWindow(xopt, Yopt, coloropt)
Show a modal window to sort data
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
x |
number
|
<optional> |
x coordinate |
Y |
number
|
<optional> |
y coordinate |
color |
string
|
<optional> |
Window color, in hexa: "#00aaee" |
# async sortBy(sortFields)
Sort by an array of fields
Parameters:
Name | Type | Description |
---|---|---|
sortFields |
Array.<object>
|
Array where each object is a sort option, like: {firstName: "asc"} |
Example
myDatatable.sortBy([
{
birthDate: "desc"
},
{
lastName: "asc"
}
])
# async sortByField(fieldId, direction)
Sort by a single field
Parameters:
Name | Type | Description |
---|---|---|
fieldId |
string
|
|
direction |
string
|
"asc" | "desc" |
Example
myDatatable.sortByField("birthDate", "desc")
# toggleSelection()
Select / Deselect records
# async updateConfig()
Update view configuration:
- while offline, just reload
- while online, check ACL prior to updating
- if ACL check is successful, save the new configuration into db
# updateLocalConfig(update)
When the view configuration can't be persisted into db, we tried to store its parameters in the local storage.
Parameters:
Name | Type | Description |
---|---|---|
update |
object
|