Data views are instances of a data controller. Data views render views of the data controller on the page, along with corresponding data controller action groups. The same data controller can be exposed with data views on the same or multiple application pages.
Data View Properties:
Property | Description |
Activator | Specifies the user interface element that will activate the data view. The available options are Tab, Side Bar Task, and Site Action. |
Auto Hide | Specifies which user interface element is hidden when the filter value is empty. |
Auto Highlight First Row | Specifies that the first row will be highlighted when the view loads. |
Auto Select First Row | Specifies that the first row will be selected in the form of the master data view. |
CSS Class Name | Assigns a CSS Class to the div that contains the data view. |
Command Argument | Specifies an argument for the startup command. |
Command Name | Specifies a command that will be executed when the data view is loaded. |
Filter Field #1-#5 | Determines which fields in the child data view are filtered by the values of the primary key fields in the master data view. |
Filter Source | Determines the master data view. |
Id | The Id is automatically assigned when the data view is created. It can be changed using the Rename context menu option in the Project Explorer. |
Page | Specifies which page the data view belongs to. |
Refresh Interval | Specifies how many seconds will pass before the data view is refreshed. When empty, the data view will not refresh automatically. |
Roles | Controls which user roles are allowed to see the data view on the page. |
Page Size | Determines how many rows are displayed in the grid. |
Search by First Letter | Displays a menu of first letters of values in the first column at the top of the data view for quick filtering. |
Search On Start | Specifies that no records will be retrieved and the advanced search bar will be opened when the page loads. |
Selection Mode | Specifies single or multiple row selection mode in the data view. |
Sequence | Provides sequential index for the data view. Data views and controls are rendered within a container in the order of the index when available. |
Show In Summary | Controls if the select data fields of the current row are displayed in the summary box on the side bar. |
Show Action Bar | Determines the visibility of the action bar. |
Show Action Buttons | Determines the location of the action buttons in form views. |
Show Details in List Mode | Indicates if detail data views are visible when a master data row is selected in the grid view. |
Show Modal Forms | Specifies that the form views of the child data views are displayed in modal windows. |
Show Page Size | Determines the visibility of the page size information in the pager. |
Show Pager | Determines the visibility of the whole pager bar at the bottom of the data view. |
Show “Quick Find” | Controls the visibility of the Quick Find box. |
Show Row Number | Displays a logical sequence number next to each row. |
Show Search Bar | Controls the visibility of the Advanced Search Bar. |
Show View Description | Determines the visibility of the description text above the data view. |
Show View Selector | Controls the visibility of the view selector in the top right corner of the data view. |
Tag | Assigns a tag to the controller to use in custom business rules. |
Text | Specifies the text displayed in the activator. |
Visible When | Specifies a JavaScript expression that must evaluate as true for the data view to be visible. |
Supported Tags:
Tag | Description |
action-buttons-none | Equivalent to setting Show Action Buttons= “None” |
calendar-drag-disabled | Calendar events will not be draggable. |
calendar-mini-disabled | Mini calendar in the sidebar will not be rendered. |
calendar-mini-twomonths | Mini calendar in the sidebar will show two months. |
content-stub-none | Disables the spacer at the bottom of the form. |
grid-fit-none | Automatic grid shrinking to fit available space will be disabled. Grid will be sized according to “Columns” defined on data fields. |
header-image-none | Disables the display of images in the header area. |
header-image-original | Form header background will use original blob, instead of thumbnail. |
inline-editing | Inline editing mode is enabled by default. |
inline-editing-none | Inline editing mode is disabled by default. |
inline-editing-option-none | Disables the inline editing toggle in the view selector. |
modal-always | Always render form as a modal. |
modal-buttons-fullscreen-none | Disables the “fullscreen” icon. |
modal-buttons-more-none | Disables the “more” icon. |
modal-dock-top modal-dock-left modal-dock-right modal-dock-bottom | Docks the modal window to the specified side of the window. |
modal-fit-content | Shrink the modal to fit the content. These modals will begin stacking, instead of sliding from the right. |
modal-auto-grow | Automatically resize the modal when field values change. Used in combination with modal-fit-content. |
modal-max-tn modal-max-xxs modal-max-xs modal-max-sm modal-max-md modal-max-lg modal-max-xl modal-max-xxl modal-max-any | The max width of the modal will be restricted to the selected logical size. |
modal-never | Never render form as a modal. |
modal-fullscreen | Modal will always start in "maximized" mode. |
modal-tap-out | Closes the modal form if the user taps outside the modal area. |
modal-title-none | Disables the modal title bar. |
modal-when-tn modal-when-xxs modal-when-xs modal-when-sm modal-when-md modal-when-lg modal-when-xl modal-when-xxl | Will begin rendering the form as modal if the screen is at least the specified logical size. Default is “md”. |
multi-select-none | User will not be able to enable multi-select on the data view. |
page-header-none | Disables the page header displayed above the form |
promo-none | Disables “promo” button. |
search-on-start-simple | When Search On Start is enabled and this tag is added, the simple search will be displayed when the page is loaded. |
search-suggestions-none | Disables search suggestions displayed on Quick Find. |
thumb-person | Image fields will be rendered in a circle. |
thumb-standard | Image fields will be rendered square. |
view-style-grid view-style-list view-style-cards view-style-map view-style-calendar view-style-charts | The view will switch to this presentation style when the page is loaded. |
view-style-grid-disabled view-style-list-disabled view-style-cards-disabled view-style-map-disabled view-style-calendar-disabled view-style-charts-disabled | The view will not offer this presentation style. |
Use tags to apply an icon to a data view.
Learn to work with data views in the Project Designer.
Learn to drag and drop data views in the Project Explorer.
Common tasks:
Task | Description |
"Soft" Filtering | Learn to activate optional filters on a data view based on a condition. |
Customizing the Search Bar | Learn to control the fields available for search in the Advanced Search Bar. |