Before you are able to use DAB you must install the extension Extesnion Kickstarter and learn how to define tables and relations. There exists several videos about the kickstarter on typo3.org but Extension Kickstarter episode III is the most important.
1. Define the tables
With DAB you start as normal in the Extension Kickstarter by defining the tables.
2. Define the data views
After tables and relations are created you move on to define the data views in the Data view section. A data view is a set of definitions that specify how tables should be presented in the front end. In a data view you specify the fields that should be visible, sort order and master/slave relations between data views.
3. Render the Data views in front end
Each data view is rendered in the front end with the plug-in Data view (a part of this extension). By placing all views on one or more pages you are making the actual implementation of your DAB application.
What DAB does behind the scene when rendering the data views in the front end is basically to create the SQL query that fetch the data from the table specified in the data view. The construction of the SQL query is based on the table definitions as they are stored in TCA and the settings of a data view. The constructed SQL query is executed and the result set is applied to a HTML template.
When creating a DAB application the tables and relations are defined as normal in the extension kick starter.
The next step is to create the data views of each table. Data views are defined in the Data view section click on the plus next to the section title and the settings for a single data view of one table could be created.
Data view settings
Property | Description |
|---|---|
Name | The name of the data view is use to identify the view. |
Description | A short description of the data view. |
View Type | How should the view be rendered. As a list, grid, form/record or dropdown. |
Data set | Select the table that should be viewed |
Fields | Select the fields that should be visible. The fields appear in the same order in the front end. |
External fields | Fields that are relations to other tables uses by default the defined label field in the foreign table. If you want to display another value in the foreign table it is possible to define it here as an external field.
|
Calculated fields | Here it is possible to define extra fields that may contain sql expressions. Alternativly it is possible to make calculations in PHP events (see later in this documentation) |
Default sort field | By default DAB uses the field defined as sort field in TCA for the table, but you can change it here. |
Default group by | Select the field you want to group by. |
Category field | In list view you may specify a field that is used as category header. The resulting SQL then sort the result set by the category field. In the list output the values of the category is used as header. |
FE user field | Select a filed that have a relation to the fe_user table. The selected field will automatically be bound to the current FE user when FE users create records. You may combine this setting with the FE Owner only property in the FE view in order to show only records that are owned by the current FE user. |
Filter | Additional expressions that goes into the where part of the generated SQL query |
Master views | In this section you specify the views that may control this view this defines the master/slave relations. Select the view that should control this view click Add.
|
Default action | Select the action that is executed when a FE user clicks on an item in the list grid or dropdown. |
Template | If the default template does not fulfill your requirements you may make your own and specify it here |
Style prefix | This values is appended to the main div tag of the rendered DAB component. It makes it possible to make specialized CSS styling |
TS | Here it is possible to make extended configuration of the data view see later this manual for an in depth coverage of this field. |
Default FE view settings
In this section it is possible to define the default values in the FE Data View plug-in when a view is selected in the plug-in.
Property | Description |
Visible fields | Select the fields that should be visible in the view. |
Editable fields | Select the fields that are editable. If a field is not defined as visible only editable the field is only visible when the view is in edit mode.
|
Show Header | When set in Grid mode the column headers are displayed. When set in Single record mode the field names are displayed. |
Show navigator | In grid and list mode the navigator is shown . |
Grid buttons | What buttons should be displayed for the grid or list |
Row buttons | What buttons that should be displayed for a row in a grid. Normally only one of the edit buttons should be displayed. Edit sets a slave view in edit mode. Edit row activates in line editing directly in the grid. Edit record switches from grid view to a form where it is possible to edit The edit buttons are only shown if the FE user are allowed to edit the records. |
Grid height | Defines the height of the grid. |
Grid header height | Defines the height of the header of the grid. Unfortunally it is not possible to define this in CSS alone as scrolling in the grid needs some calculation to work in some browsers. As a result you have set the height here and in the CSS. |
Image width | Default width of images |
Image height | Default height of images |
Max grid/list rows | Maximum number of rows in a grid. If the number of records in a query is greater that this value the Navigator is activated. |
Show empty values | If set empty values are shown in single record. |
Show label field as header | If the view mode is single record the label field is shown as a header of the record and the page title is set to the value of the label field. |
Edit fields inline | Forces inline edit of rows in grid mode. |
Use Ajax | Activates Ajax support. Activate only Ajax when needed. Ajax support gives a little extra page generation overhead. |
Public edit | Allows all fe-users to edit and update the view. In this mode chacpta is automatically turned on to prevent spam. |
View only FE owner records | When set only records that are owned by the current FE user are displayed. For this to work a FE owner field must be defined in the view (see above). |
When you have finished your work in the kick starter you should write and install your extension.
To display a data view you should use the FE plug-in Data view (a part of this extension).
Include static extension template
The first thing to do is to select the static template for the DAB view. This may be done in your main TS-template, select the “Data view (auxdataviewer)” template.
FE content element
Go to the page where you want to display the data view and insert the Data view content element.
Select the view name and fill in fields in the fields on the tabs.
Definition of properties
sheet | Property | Description |
View | View name | |
Lookup records in | ||
Create records in | ||
Use Ajax | Activates Ajax support. Activate only Ajax when needed. Ajax support gives a little extra page generation overhead. | |
Show debug info | ||
Template | Template file | |
Style prefix | ||
Layout | Show Header | When set in Grid mode the column headers are displayed. When set in Single record mode the field names are displayed. |
Show navigator | In grid and list mode the navigator is shown . | |
Grid buttons | What buttons should be displayed for the grid or list | |
Row buttons | What buttons that should be displayed for a row in a grid. Normally only one of the edit buttons should be displayed. Edit sets a slave view in edit mode. Edit row activates in line editing directly in the grid. Edit record switches from grid view to a form where it is possible to edit The edit buttons are only shown if the FE user are allowed to edit the records. | |
Grid height | Defines the height of the grid. | |
Grid header height | Defines the height of the header of the grid. Unfortunally it is not possible to define this in CSS alone as scrolling in the grid needs some calculation to work in some browsers. As a result you have set the height here and in the CSS. | |
Image width | Default width of images | |
Image height | Default height of images | |
Max grid/list rows | Maximum number of rows in a grid. If the number of records in a query is greater that this value the Navigator is activated. | |
Show empty values | If set empty values are shown in single record. | |
Show label field as header | If the view mode is single record the label field is shown as a header of the record and the page title is set to the value of the label field. | |
Edit fields inline | Forces inline edit of rows in grid mode. | |
Sub page | Single view | Page to change to when viewing a single record. DAB will change to this page if the View Type is List and the default selection is View or items in the list have a view button. |
Print single | Page to change to when viewing a single record. DAB will change to this page if the View Type is List or Grid and the default action is print or items in the list have a print button. | |
Print list | Page to change to when view a list and the user click on the grid button print. | |
Edit single | ||
Access | Public edit | Allows all fe-users to edit and update the view. In this mode chacpta is automatically turned on to prevent spam. |
View only FE owner records | When set only records that are owned by the current FE user are displayed. For this to work a FE owner field must be defined in the view (see above). | |
Allow edit | Only fe users that belongs to selected FE usergroups are allowed to edit records. | |
