| Table of Contents |
|---|
Introduction
With CRUD, one will not need to do all the manual wiring in constructing a CRUD entity.
This element provides a userview menu to show the datalist of your choice and selectable forms to associate with the datalist to perform CRUD operations.
CRUD Properties
Edit CRUD
id:| Name | Description | Screens (Click to view) |
|---|---|---|
| id | Menu element unique id. Userview will use this id in the URL for the menu if the Custom ID is empty. |
Figure 1: CRUD Properties
Figure 2: Sample CRUD in runtime |
| Custom ID |
...
Item link slug. Optional field.
| |||
| Label |
...
| The userview menu label. You can add Font Awesome Icons into your menu labels. | |
| List |
...
| Datalist to load. | |
| Form (Add) |
...
Target form to open when adding new record. Optional field. If this attribute is not mapped, then ability to add is disabled. | |
| Form (Edit) |
...
Target form to open when editing existing record. Optional field. If this attribute is not mapped, then ability to edit is disabled. |
Figure 1: CRUD Properties
Figure 2: Sample CRUD in runtime
List
UI
List
UI
| Name | Description | Screens (Click to view) |
|---|---|---|
Show Number of Rows In Menu |
...
Show number of rows beside this userview menu.
|
Figure 3: UI - List Properties | |||
| Button Position |
...
Available options:
| |
| Selection Type |
...
Available options:
| |
| Selector Position |
...
Available options:
| |
Edit Link Label |
...
Edit link button label to show in listing. | |
New Record Button Label |
...
New record button label to show in listing. | |
Delete Button Label |
...
Delete button label to show in listing. | |
Show Delete Button? |
...
When checked, the delete button will be shown, effectively enabling the deletion capability. If "Show Delete Button" is enabled, the following options will be shown:
| |
Custom Header |
...
| Custom Header in HTML to show above the listing. | |
| Custom Footer |
...
| Custom Footer in HTML to show |
...
| below the listing. |
Figure 3: UI - List Properties
...
Actions
| Name | Description | Screens (Click to view) |
|---|---|---|
| More Actions |
...
This attribute allows you to add more actions into the listing.
For example, see Figure 5. |
...
Figure 4: Actions - List Properties
Figure 5: Sample List Actions in runtime |
Add
UI
| Name | Description | Screens (Click to view) |
|---|---|---|
| Cancel Button Label |
...
| Cancel Button Label to show in add new record form. |
Figure 6: UI - Add Properties | |
| Save Button Label |
...
| Save Button Label to show in add new record form. | |
| Custom Header |
...
| Custom Header in HTML to show in add new record form. | |
| Custom Footer |
...
| Custom Footer in HTML to show in add new record form. |
Actions
Figure 6: UI - Add Properties
...
| Name | Description | Screens (Click to view) |
|---|---|---|
Message to show after Form saved |
...
Message to show after Form saved. |
Figure 7: Actions - Add Properties | |
| Action to perform after Form saved |
...
| |
After Form Saved - Redirection (Hyperlink) |
...
Hyperlink URL. Only applicable when "Action to perform after Form saved" is set to "Redirection".
| ||||||
After Form Saved - Redirection (Parameter Name) |
...
Parameter to be appended as part of the link defined above. Only applicable when "Action to perform after Form saved" is set to "Redirection".
| ||||||
After Form Saved - Redirection (Field Name) |
...
Value to be assigned to the parameter defined above. Only applicable when "Action to perform after Form saved" is set to "Redirection".
|
Figure 7: Actions - Add Properties
Edit
UI
...
Edit
UI
| Name | Description | Screens (Click to view) |
|---|---|---|
| Readonly | If checked, effectively, the form will be rendered as read only and not editable anymore. |
Figure 8: UI - Edit Properties
Figure 9: Sample record traversing in runtime |
Display Fields as Labels when in Readonly? |
...
| When the form is in read only form, determines if values should be displayed as it is (label form) instead of being bounded in original input form. | |
| Back Button Label |
...
Back Button Label |
...
Default value: Back |
Save Button Label |
...
Save Button Label |
...
Default value: Save |
Record Traversing |
...
Enable record traversing when viewing a individual record in its form. For example, see Figure 9. | |
First Record Button Label |
...
First Record Button Label. Only applicable when Record Traversing is enabled. |
...
Default value: First Record |
Previous Record Button Label |
...
Previous Record Button Label. Only applicable when Record Traversing is enabled. |
...
Default value: Previous Record |
Next Record Button Label |
...
Next Record Button Label. Only applicable when Record Traversing is enabled. |
...
Default value: Next Record |
Last Record Button Label |
...
Last Record Button Label. Only applicable when Record Traversing is enabled. |
...
Default value: Last Record |
| Custom Header |
...
| Custom Header in HTML to show when editing an individual record in a form. | |
| Custom Footer |
...
| Custom Footer in HTML to show when editing an individual record in a form. |
Figure 8: UI - Edit Properties
Figure 9: Sample record traversing in runtime
Actions
Actions
| Name | Description | Screens (Click to view) |
|---|---|---|
| Message to show after Form saved |
...
| Message to show after Form is saved |
Figure 10: Actions - Edit Properties
Figure 11: Sample Edit Actions in runtime | |
Action to perform after Form saved |
...
| |
After Form Saved - Redirection (Hyperlink) |
...
URL to redirect to after submission. Only applicable when Action to perform after Form saved is set to Redirection. | |
After Form Saved - Redirection (Parameter Name) |
...
Parameter to be included. Only applicable when Action to perform after Form saved is set to Redirection. | |
After Form Saved - Redirection (Field Name) |
...
Parameter value to be assigned to the parameter above by defining a field ID from the form. Only applicable when Action to perform after Form saved is set to Redirection. | |
More Actions |
...
Include action buttons to be added into the bottom of the form.
For example, see Figure 11.
|
Figure 10: Actions - Edit Properties
Figure 11: Sample Edit Actions in runtime
Advanced
...
Advanced
| Name | Description | Screens (Click to view) |
|---|---|---|
| Userview Key Name | Define a column name to pre-filter the datalist via the userview key value. See Userview Key for more info. |
...
Figure 12: Advanced Properties |
Performance & Offline
Cache Settings
...