Extension Overview¶
Edit the extension sav_library_example9
in the SAV Library Kickstarter to get an overview. It contains
one form with three conventional List
, Single
and Edit
views.
There is nothing special in the List
view.
Edit View¶
Two subforms are used to input the graph data. Even if another choice was possible
for the field graph1
, the use of a subform makes it possible to use similar queries
for the graph.
The subform
graph1
is configured to allow the input of one item. It is used to input the number of sunny, cloudy and rainy day in the month.the subform
graph2
is used to enter the minimal and maximal temperature for a given day. Note the field attributes used to add a delete button and up and down buttons in front of each item.addDelete = 1; addUpDown = 1;
Single View¶
The type of the field graph
is Graph.
Its configuration includes the following properties.
cutLabel = 1;
graphTemplate = typo3conf/ext/sav_library_example9/Resources/Private/Templates/Charts.xml;
allowQueries = 1;
tags =
marker#uidQueryGraph1 = 1,
marker#uidQueryGraph2 = 2,
marker#uidMainTable = ###uidMainTable###,
;
Analyze the graph template Charts.xml
provided in the folder
Resources/Private/Templates
of the extension.
The markers marker#uidQueryGraph1
and marker#uidQueryGraph2
are used in the
definition of the query manager. You could have to modify the value 1 and 2 as explained
in the next section. The marker marker#uidMainTable
takes the value of the current
uid
of the main table, i.e. tx_savlibraryexample9
. This value is always available
by means of the marker ###uidMainTable###
.
<query id="graph1">
<setQueryManager name="savcharts" uid="marker#uidQueryGraph1" uidMainTable="marker#uidMainTable" />
</query>
...
<query id="graph2">
<setQueryManager name="savcharts" uid="marker#uidQueryGraph2" uidMainTable="marker#uidMainTable" />
</query>
Queries¶
Add two Sav Charts queries in backend list mode. The following caption shows the
result with queries inserted in the Data
folder.
Fill the query Query Graph 1
as shown below.
The subforms used for the field graph1
and graph2
generates relations n:n.
Therefoe, the FROM
clause joins the tables tx_savlibraryexample9
,
tx_savlibraryexample9_graph1_mm
and tx_savlibraryexample9_graph1
.
tx_savlibraryexample9
INNER JOIN tx_savlibraryexample9_graph1_mm
ON tx_savlibraryexample9.uid = tx_savlibraryexample9_graph1_mm.uid_local
INNER JOIN tx_savlibraryexample9_graph1
ON tx_savlibraryexample9_graph1_mm.uid_foreign = tx_savlibraryexample9_graph1.uid
The WHERE
clause retricts the records to the one used by the Single
view. The marker
###uidMainTable###
does the job.
tx_savlibraryexample9.uid = ###uidMainTable###
Fill the query Query Graph 2
by replacing respectively
tx_savlibraryexample9_graph1
and tx_savlibraryexample9_graph1_mm
by
tx_savlibraryexample9_graph2
and tx_savlibraryexample9_graph2_mm
.
Important
The uid of the Sav Charts queries should be 1 and 2. However, if you do have already enter
other Sav Charts queries their uid will be different. You can modify the values in the
tags
property of the field graph
in the Singe
view and regenerate the extension.
You may also change the configuration using the field
configuration, for example at the
extension level. The following TypoScript sets the values of the
markers marker#uidQueryGraph1
and marker#uidQueryGraph2
respectively to 3 and 4.
plugin.tx_savlibraryexample9_pi1.Default.singleView.fields.graph.tags (
marker#uidQueryGraph1 = 3,
marker#uidQueryGraph2 = 4,
marker#uidMainTable = ###uidMainTable###
)
Enter data in the frontend as shown below.
Save, and go to the frontend.