The user-interface of each of the Data View Toolset web parts is made of display controls. Some of the display controls are generic therefore available in all Data View Toolset web parts, while others are available only in specific web parts.
The generic display-controls are:
Info & Headers
Displays several levels of configurable web part headers as well as version information.
Displays top and bottom menu bars with configurable menus.
A navigation control used together with data display contol such as Table or List to allow user navigate between data pages.
Enables grouping the displayed data into configurable tabs.
Enables grouping the displayed data into configurable accordion sections..
A content-display control that displays your data using a grid UI.
A content-display control showing your data in an inbox-style responsive layout.
Dynamic filter control, enabling you to filter the connected list by various columns. In addition, end-user can add additional columns to the filter control by drag&drop the required column to the filter control area.
This control enables you to configure conditional formatting rules based on column values. These rules apply to various controls that display content: table, list, org. chart and calendar.
The controls that are available only in specific web parts are:
Picture gallery controls
Available only in the Picture Gallery web part.
A set of controls displaying pictures in various layouts such as Camera slideshow, Photopile and Gallery.
Org. chart controls
Available only in the Org. Chart web part.
A set of controls that display hierarchical organization structure with many configurable properties.
Available only in the Calendar Plus web part.
The calendar control displays aggregated events from various data sources in a great-looking Calendar display (Month/week/day/agenda etc.)
The following sections provide details on each of the generic controls' functionality and configrable properties.
Clicking this toggle-button will switch the web part between advanced/simple modes.
In Simple mode, clicking this button will open a settings page enabling the admin to configure which controls should be visible to users:
License Info & Headers
Clicking this button will open a settings page where you can see your installed app's version & license details, as well as to update the web part's displayed headers:
When clicking an existing actions' "..." icon to edit the action, you will see the Script editor popup window:
This popup enables you to add custom actions by writing your own custom knockout code. While implementing your required action, you can use parameters that enable you to access the required context. To learn more about each such parameter, click the parameter’s info iconin this popup.
When adding a custom action you should select an icon for your action and provide a tooltip. You can then write your own code as mentioned above or use the available snippets under the “Global actions” menu:
When selecting one of these snippets, its knockout code will appear in the editor. Of course, you can customize this code to match your exact requirements.
A paging control splits your displayed view into several pages, useful when you have large list of items. .
This control includes the following properties:
Optional title that can be displayed above the tabs, can also be a dynamic formula, using the formula editor.
Same as the Tabs control, the Groups control groups the displayed data by a selected column. The grouped data is displayed inside collapsable groups.
It includes the following properties:
Select the column by which you want to group the displayed data into collapsible groups.
You can select the way groups are expanded/collapased:
The Table control displays data from the data-source using a grid layout.
By default the Table control displays all the columns from the data source. If you wish to display only selected columns, click the "Add Columns..." to selected the exact columns to be displayed in the grid.
Select the required behaviour when user clicks an item in the displayed table:
The Table control enables displaying up to 4 item actions (Action #1 - Action #4), and configure the Item Click action which can be triggered when user clicks an item (according to 'Item click' property value).
Maximum table height
The List control displays data from the data-source using a responsive layout which is more suitible for hand-held devices.
Maximum table height
Example: the following picture shows A Filter control, configured to display 2 fiters: City and Budget. The Filter control was added above the Table control:
Show free text filter
You can add filters from the toolpane by clicking "Add columns..", as well as reorder the filters in the web part.
Free text filter placeholder
Search in field placeholder
Place holder to be displayed in the filters.
The Conditional Formating (CF) control enables you to configure conditional formatting rules based on column values. These rules apply to various controls that display data: table, list, org. chart and calendar. You can optionally also display a legend by configuring the control properties.
Switch to "On" to make items that comply with the rule automatically selected. Controls that support selecting items, such as list and table, will show these items as selected.
Controls that support new items, such as list and table, will mark these items as new.
When finished configuring the conditional formatting rule, you should see it applied immediatelly on the displayed data:
Show the conditional formating legend below the displayed data.
Show legend on left
Show legend on right
Show the conditional formating legend right to the displayed data.