List Page Properties
01. Page Design
PageTitle
This enables users to set a preferred title name for a page.
DisplayType
Choose between Table List or Custom view in other to set how records are displayed on a particular page.
ReloadOnNavigate
If set to True
reloads and clears whatever data the page holds on navigation. This is useful in a single page application like vue.js
EmptyRecordMessage
This is the message you want users to see when the page record is empty.
02. Default Query Configuration
Join
This helps in retrieving data from two or more database tables.
Select Tables
This displays the list of tables available in your database, that will be selected for the join statement.
Joined Tables
This are the list of database tables that have been selected for the join statement.
Join Condition
Join Type: Enables user to chose the type of joining that will take place between the tables.
INNER JOIN
: This is used to return rows from both tables that satisfy the given condition.LEFT JOIN
: This returns all the rows from the table on the left even if no matching rows have been found in the table on the right. Where no matches have been found in the table on the right, NULL is returned.RIGHT JOIN
: This returns all the columns from the table on the right even if no matching rows have been found in the table on the left. Where no matches have been found in the table on the left, NULL is returned.
Left Field: Enables user to select a table field for the Join Type left field.
Right Field: Enables user to select a table field for the Join Type right field.
Sample SQL statement structure
This displays a sample of the generated SQL statement based on the Join Condition configuration.
Where
Enables user to enter the Where condition. e.g id=1 AND cus_id=1
A
WHERE
clause in SQL specifies that a SQL Data Manipulation Language (DML) statement should only affect rows that meet specified criteria. The criteria are expressed in the form of predicates.
Having
Enables user to enter the Having condition. e.g sum_of_price > 2000
or SUM(Amount) > 500
A
HAVING
clause in SQL specifies that an SQLSELECT
statement should only return rows where aggregate values meet the specified conditions. It was added to the SQL language because theWHERE
keyword could not be used with aggregate functions.
Order By
Enables user to select the field for the data to be sorted by and if it should be sorted in ASC
(Ascending order) or DESC
(Descending order).
An
ORDER BY
clause in SQL specifies that a SQLSELECT
statement returns a result set with the rows being sorted by the values of one or more columns.
RecordLimit
Enables the user to limit the number of record to queried.
03. Page Components
ActionButtonDisplayStyle
Allows user to choose how to display the action buttons on the table view. Styles are (Icons
, Dropdown
).
DeleteButton
Allows user to add a delete button for deleting records on List Page.
EditButton
Allows user to add an edit button for editing records on List Page.
ViewButton
Allows user to add a view button for viewing records on List Page.
EditButtonText
Allows user to name the edit button.
ViewButtonText
Allows user to name the view button.
DeleteButtonText
Allows user to name the delete button.
ExportButton
Allows user to add an export button for exporting records on List Page.
ExportButtonText
Allows user to name the export button.
ImportDataSettings
01 JSON Import
EnableJSONImport: Enables user to import a JSON file type when set to
True
02 CSV Import
EnableCSVImport: Enables user to import a CSV file type when set to
True
QuoteChar: Allows user to set the type of code character that an imported CSV file contains.
SeparatorChar: Allows user to select the type of data separator the imported JSON file contains.
Misc
SaveFile: Enables user to save the file to the server after importing the records to the database.
UseTransactional: This database concept when set to
True
, allows for a data importation process to be aborted when an error is encountered.
ImportButtonText
Allows user to name the import button.
ListSequence
When set to True
, numbers the record sequentially on the page.
IncludeCheckbox
When set to True
, displays a checkbox for each record, allowing for multiple action to be taken on selected records.
Pagination
When set to True
, displays a number of records based on user PaginationSettings.
PaginationSettings
When Numeric PrevNext
is selected, includes a numeric numbering between the Previous and Next buttons in the pagination;
When PrevNext Only
is selected, removes the numeric numbering between the Previous and Next buttons in the pagination.
Record Count: When checked, adds record counting to the page pagination.
Page Count: When checked, adds page counting to the page pagination.
Record Limit: When checked, adds record limiting to the page pagination.
Apply Current Settings to All Pages: when Checked, adds the current pagination settings to all pages.
SearchField
When set to True
display the page search field and if set to False
, hides the page search field.
04. Table Design
WrapperClass
Allows user to set the wrapper class for current page, either a custom class is added by typing or selected from the drop down list.
TableBorderStyle
Allows user to select how the table border should be styled.
None: When selected hides the table border.
Horizontal: When selected adds the horizontal table border.
Both: When selected adds both vertical and horizontal borders.
TableStriped
When set to True
adds a gray color to the odd number rows in the table. And if False
, removes the gray color on the odd number rows.
TableDark
When set to True
changes the table color to black and if False
is selected, sets the table color to white.
TableCompact
This displays the table in smaller padded cells if set to True but does not compact the table when set to False
.
TableHeaderBackground
This sets the table header color.
TableHeaderTextColor
This sets the table header text color.
TableHoverable
When set to True
, adds highlight when the mouse hovers over the table records.
TableResponsive
When set to True
adds responsiveness to the table, which makes it adjust to different screen size.
05. Page Modal
ModalEdit
When set to True, makes the Edit Page display as a modal.
Note: ModalEdit does not support old browsers like Internet Explorer.
ModalView
When set to True, makes the View Page display as a modal.
Note: ModalView does not support old browsers like Internet Explorer.
Last updated