diff --git a/_data/components/otableData/types/OTableInitializationOptions.yml b/_data/components/otableData/types/OTableInitializationOptions.yml index 7c2e136ec..d36e2ec72 100644 --- a/_data/components/otableData/types/OTableInitializationOptions.yml +++ b/_data/components/otableData/types/OTableInitializationOptions.yml @@ -1,4 +1,4 @@ -type : "OTableInitializationOptions" +type: "OTableInitializationOptions" propertiesColumns: ["Name", "Type", "Description"] @@ -8,23 +8,24 @@ attributes: [{ optional: true },{ name: "service", - optional: true, - type: "string" + type: "string", + optional: true },{ name: "columns", - optional: true, type: "string", - + optional: true },{ name: "visibleColumns", type: "string", optional: true -}, -{ +},{ + name: "defaultVisibleColumns", + type: "string", + optional: true +},{ name: "keys", type: "string", optional: true - },{ name: "sortColumns", type: "string", @@ -36,9 +37,16 @@ attributes: [{ },{ name: "filterColumns", type: "string", - description : "The old value for the target." - + optional: true, + description: "Columns that can be used to filter data. The old value for the target." +},{ + name: "data", + type: "ServiceResponse", + optional: true, + description: "Initial table data returned from the associated service." +},{ + name: "paginationData", + type: "PaginationData", + optional: true, + description: "Pagination information such as current page, size, and total records." },] - - - diff --git a/_data/components/otableData/types/PaginationData.yml b/_data/components/otableData/types/PaginationData.yml new file mode 100644 index 000000000..e79de08bc --- /dev/null +++ b/_data/components/otableData/types/PaginationData.yml @@ -0,0 +1,25 @@ +type: "PaginationData" + +propertiesColumns: ["Name", "Type", "Description"] + +attributes: [{ + name: "pageNumber", + type: "number", + optional: true, + description: "Current page number." +},{ + name: "pageSize", + type: "number", + optional: true, + description: "Number of records per page." +},{ + name: "startRecordIndex", + type: "number", + optional: true, + description: "Starting index of the current page’s records." +},{ + name: "totalQueryRecordsNumber", + type: "number", + optional: true, + description: "Total number of records returned by the query." +},] diff --git a/_includes/o-component-table.md b/_includes/o-component-table.md index b631595e6..80ba8a0e7 100644 --- a/_includes/o-component-table.md +++ b/_includes/o-component-table.md @@ -205,6 +205,8 @@
  • OTable Grouped Row
  • OTable Initialization Options +
  • +
  • Pagination Data
  • O_TABLE_GLOBAL_CONFIG
  • diff --git a/docs/components/data/35-o-table.component.md b/docs/components/data/35-o-table.component.md index 95f350cd9..668e05182 100644 --- a/docs/components/data/35-o-table.component.md +++ b/docs/components/data/35-o-table.component.md @@ -1254,14 +1254,34 @@ You can customize the tooltip styles by redefining the class `o-table-cell-toolt ### Reinitialize method -When you perform an action like update columns, visible columns, filter by columns, service, entity, keys or primary keys of the table, you will want `o-table` to update the display to reflect these changes. This function is provided for that purpose.For more information see the API. +The `reinitialize` method is used to refresh the `o-table` whenever its configuration changes. +You should call this method when any of the table’s main parameters are updated — such as **columns**, **visible columns**, **filters**, **service**, **entity**, **keys**, or **parent keys**. + +This ensures that the table’s display and data remain synchronized with the latest configuration. +For more information, see the API documentation. ```javascript ... -const columnsOfTable= 'PHOTO;ID;NAME;SURNAME;EMAIL;ADDRESS'; -const filterColumnsOfTable= 'NAME;EMAIL'; - -this.table.reinitialize({ columns: columnsOfTable, visibleColumns: columnsOfTable, filterColumns:filterColumnsOfTable}); +const columnsOfTable = 'PHOTO;ID;NAME;SURNAME;EMAIL;ADDRESS'; +const filterColumnsOfTable = 'NAME;EMAIL'; +const defaultVisibleColumns = 'PHOTO;ID;NAME;EMAIL'; + +// Example pagination data +const paginationData = { + pageNumber: 1, + pageSize: 20, + startRecordIndex: 0, + totalQueryRecordsNumber: 100 +}; + +// Reinitialize table with updated parameters +this.table.reinitialize({ + columns: columnsOfTable, + visibleColumns: columnsOfTable, + defaultVisibleColumns: defaultVisibleColumns, + filterColumns: filterColumnsOfTable, + paginationData: paginationData +}); ... ```