Table
Description:
Table
Table component is used to represents tabular data — that is, the information presented in a two-dimensional table comprised of rows and columns of cells containing data.
Allowed Parent Components:
Card Body
Col
Allowed Child Components:
Checkbox Column
Date Column
Icon Column
Number Column
Pulse
Select Column
String Column
Trigger Before Render
Trigger On No Data Action Button Click
Trigger On Row Click
TriggerOnRowDoubleClick
Properties
➤ Hover
Check this to highlight the column on hover.
Allowed Values: Yes/No
➤ Condensed
Check this to make a table more compact by removing cell padding in half.
Allowed Values: Yes/No
➤ Striped
Check this to get striped rows.
Allowed Values: Yes/No
➤ Show Row Lines
Check this to show the lines between the rows.
Allowed Values: Yes/No
➤ Show Column Lines
Check this to show the lines between the columns.
Allowed Values: Yes/No
➤ No Pagination
Check this to disable pagination. This will hide the option to load more data.
Allowed Values: Yes/No
➤ No Data Icon
Select an icon to display when no data found.
Allowed Values: Icon List
➤ No Data Text1
Provide a text to display when no data found.
Allowed Values: Free text field
➤ No Data Text2
Provide a text to display when no data found.
Allowed Values: Free text field
➤ Hide Dirty Indicators
Check this to hide indicator for dirty values.
Allowed Values: Yes/No
➤ Show Border
Check this to show border.
Allowed Values: Yes/No
➤ Icon
Select an icon for button when no data found.
Allowed Values: Icon List
➤ Text
Provide a text for button when no data found.
Allowed Values: Free text field
➤ onClick
Select or enter the action need to be performed on button click.
Allowed Values: Controller Function
➤ Color
Select a color or enter the custom class to change the color of the button.
Allowed Values: Select a color or enter the custom class to change the color of the button.
➤ Use Existing Data Source
Choose this prop if you want to reuse a Data Source that was defined on some other component on this page or any of the parent abstract pages.
Allowed Values: Yes/No
➤ Data Source
Select a datasource from the list.
Allowed Values: Select a datasource from the list.
➤ Data Source Alias
Allowed Values: Free text field
➤ Default Where Clause
Allowed Values: Free text field
➤ Max Rows
Allowed Values: Any number value
➤ Order By Clause
e.g. #firstAttr#, #secondAttr# DESC
Allowed Values: Free text field
➤ Auto Query
Check this property to query the selected datasource on component render.
Allowed Values: Yes/No
➤ Execute Count SQL
Check this to execute count SQL to get the total number of rows in the database on a query. You can get this value by using the expression: #{DataStore.totalLength}
Allowed Values: Yes/No
➤ Execute Distinct SQL
Check this to execute distinct SQL to get the total number of distinct rows in the database on a query.
Allowed Values: Yes/No
➤ Insert Allowed
Allowed Values: Yes/No
➤ Update Allowed
Allowed Values: Yes/No
➤ Delete Allowed
Check to enable deleting the existing row.
Allowed Values: Yes/No
➤ Mask Page On Post
Check to enable page masking on save.
Allowed Values: Yes/No
➤ Do Not Monitor Query Request
Check to disable monitoring query request.
Allowed Values: Yes/No
➤ Silent Server Validate
Check to enable silent server validate.
Allowed Values: Yes/No
➤ Silent Fetch
Check to enable silent fetching.
Allowed Values: Yes/No
➤ Make New Records Dirty
Check this property to make new record dirty. If this property is checked the status of the new record will be 'Insert' else it will be 'New'
Allowed Values: Yes/No
➤ Margin
Select a value to add margin on all four sides of the component. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.
Allowed Values: Any number value
➤ Margin Bottom
Select a value to add margin on the bottom of the component.
Allowed Values: Any number value
➤ Margin Left
Select a value to add margin on the left of the component.
Allowed Values: Any number value
➤ Margin Right
Select a value to add margin on the right of the component.
Allowed Values: Any number value
➤ Margin Top
Select a value to add margin on the top of the component.
Allowed Values: Any number value
➤ Padding
Select a value to add padding on all four sides of the component. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.
Allowed Values: Any number value
➤ Padding Bottom
Select a value to add padding in the bottom of the component.
Allowed Values: Any number value
➤ Padding Left
Select a value to add padding in the left of the component.
Allowed Values: Any number value
➤ Padding Right
Select a value to add padding in right of the component.
Allowed Values: Any number value
➤ Padding Top
Select a value to add padding in top of the component.
Allowed Values: Any number value
Last updated