New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
DDL for 7.1 docs #17
DDL for 7.1 docs #17
Changes from 1 commit
0b470e7
570dcc8
89b5b88
a72516d
3dae8ea
93e7d49
cd832b0
91acdee
10bedb6
fd46644
3c54863
474c941
f803660
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,31 @@ | ||
# Using Templates to Display Forms and Lists | ||
|
||
After creating data definitions and lists, you can control how the form appears | ||
to your users, and how the resulting list of records is displayed. You do this | ||
by creating templates for each view (form view and record display view) and | ||
selecting them in the DDL Display portlet. For example, you might need to create | ||
a form with a subset of a data definition's fields. Rather than creating a new | ||
definition, you can create a template that displays only the fields you want | ||
from the existing definition. You could also use a template to arrange fields | ||
differently, and/or with different labels and configuration options. | ||
|
||
Data definitions can have as many form and display templates as you care to | ||
create (or none, if you're satisfied with the default templates). You then | ||
choose a list's template in the Dynamic Data Lists Display widget. | ||
|
||
## Managing Display and Form Templates | ||
|
||
Since Display and Form Templates correspond to a particular data definition, | ||
they're accessed from the Data Definitions screen of the Dynamic Data Lists app | ||
in Site Administration. See the | ||
[Creating Data Definitions article](liferay.com) | ||
for instructions on accessing this screen. | ||
|
||
The Data Definitions screen lists each definition in a table. To start working | ||
with a definition's templates, click the definition's Actions button | ||
(![Actions](../../../images/icon-actions.png)) | ||
and select *Manage Templates*. This opens a screen that lists the definition's | ||
templates. You can edit, copy, delete, or configure permissions for a | ||
definition via its Actions button | ||
(![Actions](../../../images/icon-actions.png)). | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,48 @@ | ||
# Creating Form Templates | ||
|
||
Form templates let you control how the data entry form appears for a data | ||
definition. Follow these steps to create a form template for a definition: | ||
|
||
1. Open the Menu | ||
(![Menu](../../../images/icon-menu.png)) | ||
and expand your site's menu (the Site Administration menu). Then select | ||
*Content* → *Dynamic Data Lists*. This opens the Dynamic Data Lists | ||
screen. A table lists any existing dynamic data lists. | ||
|
||
2. Click the *Options* button at the top-right | ||
(![Options](../../../images/icon-options.png)) | ||
and select *Manage Data Definitions*. The Data Definitions screen appears. A | ||
table lists any existing data definitions. | ||
|
||
3. Click the definition's *Actions* button | ||
(![Options](../../../images/icon-options.png)) | ||
and select *Manage Templates*. This opens a screen that lists the | ||
definition's templates. | ||
|
||
4. Click the *Add* button | ||
(![Add](../../../images/icon-add.png)) | ||
and select *Add Form Template*. This presents the same kind of graphical, | ||
drag-and-drop interface used to | ||
[create definitions](liferay.com). | ||
|
||
5. Give your template a name, then expand the *Details* section and give it a | ||
description. You can also use the *Mode* selector to select which mode the | ||
template applies to (*Create* or *Edit*). | ||
|
||
6. Scroll down to the graphical designer in the *View* tab, and make your | ||
desired changes. For example, you can move or delete fields, change field | ||
labels, and more. | ||
|
||
7. Click *Save* when you're finished. | ||
|
||
Alternatively, you can create form templates from the Dynamic Data Lists Display | ||
widget: | ||
|
||
1. Follow the instructions in the | ||
[Creating Data Lists article](liferay.com) | ||
for adding and configuring the widget in a site page. Make sure to configure | ||
the widget to show the list whose definition you want to create a template | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. The word whose was removed after the last review, however its absence changes the meaning significantly, thus I believe it should be re-added. After all, by default, the Dynamic Data List Display widget displays the list and not its definition. |
||
for. | ||
|
||
2. Click the widget's *Add Form Template* button. This opens the same form as | ||
above for creating a form template for the list's definition. |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,87 @@ | ||
# Creating Display Templates | ||
|
||
For every data definition, you can create as many displays as you need. If | ||
you've created a form template that doesn't show all the fields of a particular | ||
data definition, you probably don't want to display those fields in the list, | ||
either. | ||
|
||
+$$$ | ||
|
||
**Note:** If you're familiar with | ||
[web content templates](/discover/portal/-/knowledge_base/7-1/designing-web-content-with-templates), | ||
display templates customize the display of a list in the same way. Display | ||
templates can be written in FreeMarker or Velocity, pulling data from the data | ||
definition in the same way that web content templates pull data from their | ||
structures. Also similar to web content templates, display templates can be | ||
embedded in other display templates. This allows for reusable code, JS library | ||
imports, or macros which will be imported by Velocity or FreeMarker templates in | ||
the system. Embedding display templates provides a more efficient process when | ||
you have a multitude of similar data definitions. Just import an embedded | ||
display template and work off of it for your new display template. | ||
|
||
$$$ | ||
|
||
As with | ||
[form templates](liferay.com), | ||
you can create display templates from the Dynamic Data Lists app in Site | ||
Administration, or the Dynamic Data Lists Display widget. | ||
|
||
Follow these steps to create a display template from Site Administration: | ||
|
||
1. Open the Menu | ||
(![Menu](../../../images/icon-menu.png)) | ||
and expand your site's menu (the Site Administration menu). Then select | ||
*Content* → *Dynamic Data Lists*. This opens the Dynamic Data Lists | ||
screen. A table lists any existing dynamic data lists. | ||
|
||
2. Click the *Options* button at the top-right | ||
(![Options](../../../images/icon-options.png)) | ||
and select *Manage Data Definitions*. The Data Definitions screen appears. A | ||
table lists any existing data definitions. | ||
|
||
3. Click the definition's *Actions* button | ||
(![Options](../../../images/icon-options.png)) | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Shouldn't be the |
||
and select *Manage Templates*. This opens a screen that lists the | ||
definition's templates. | ||
|
||
4. Click the *Add* button | ||
(![Add](../../../images/icon-add.png)) | ||
and select *Add Display Template*. This opens the New Template form. | ||
|
||
5. Give the template a name, then expand the *Details* section of the form and | ||
give it a description. Also in the details section of the form, select the | ||
templating language to use from the *Language* selector. You can choose | ||
[FreeMarker](https://freemarker.apache.org/index.html), | ||
or | ||
[Velocity](https://velocity.apache.org/). | ||
|
||
6. In the *Script* section of the form, create your template in the editor | ||
using the templating language you chose in the previous step. The palette to | ||
the left of the editor contains common variables. Click a variable to insert | ||
it in the editor. Another useful tool in the editor is the autocomplete | ||
feature. In a FreeMarker template, you can invoke it by typing `${`, which | ||
opens a drop-down menu of common variables. Select a variable to insert it | ||
in the editor. Alternatively, you can upload a complete script file via the | ||
*Browse* button below the editor. | ||
|
||
7. Click *Save* when you're done creating the template. | ||
|
||
![Figure 1: Create your display template in the editor.](../../../images/ddl-template-editor.png) | ||
|
||
Alternatively, you can use the Dynamic Data Lists Display widget to create | ||
display templates: | ||
|
||
1. Follow the instructions in the | ||
[Creating Data Lists article](liferay.com) | ||
for adding and configuring the widget in a site page. Make sure to configure | ||
the widget to show the list whose definition you want to create a template | ||
for. | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. On the most recent version of this article, the word whose was removed, but its absence changes the meaning of the sentence and, in my opinion, it shouldn't be removed. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Good point. I think we can phrase this to be in terms of the list since that's the way the user will be thinking. They're creating a template with a certain list in mind, right?
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Correct! I see what you mean. Sounds good. |
||
|
||
2. Click the widget's *Add Display Template* button. This opens the same form | ||
as above for creating a display template for the list's definition. | ||
|
||
<!-- | ||
Per Russ, include a more detailed example of creating a template, when possible. | ||
See example in the analogous 7.0.x article, and figure out which code isn't | ||
specific to the cross-article Lunar Resort example in those docs. | ||
--> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Shouldn't be the
../../../images/icon-actions.png
instead?