Skip to content

Commit

Permalink
Final proofread input widgets section
Browse files Browse the repository at this point in the history
  • Loading branch information
MarkvanMents committed Sep 24, 2019
1 parent fe07701 commit b097ffa
Show file tree
Hide file tree
Showing 10 changed files with 31 additions and 36 deletions.
2 changes: 1 addition & 1 deletion content/refguide/check-box.md
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,7 @@ This differs from the [On change](#on-change) property in that the event will al

{{% snippet file="refguide/visibility-section-link.md" %}}

## Read More
## 3 Read More

* [Data view](data-view)
* [Attributes](attributes)
6 changes: 3 additions & 3 deletions content/refguide/date-picker.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,11 @@ tags: ["studio pro"]

## 1 Introduction

A **date picker** is used to display and, optionally, allow the end-user to edit the value of an attribute of [data type](data-types) *Date and Time*. It uses the values set in the **Languages** tab of **Project Settings** to display a correctly localized value to the end-user, using the **Language** entity associated with the end-user.
A **date picker** is used to display and, optionally, allow the end-user to edit the value of an attribute of [data type](data-types) *Date and Time*. It uses the values set in the **Languages** tab of **Project Settings** to display a correctly localized value to the end-user, using the **Language** object associated with the end-user.

A date picker must be placed in a [data widget](data-widgets) and displays an attribute of the object(s) retrieved by that widget. The name of the attribute to be displayed is shown inside the date picker, between square brackets, and colored blue.

For example, the following text box allows the end-user to see, and set, the **LastContacted** date of a customer.
For example, the following date picker allows the end-user to see, and set, the **LastContacted** date of a customer.

![](attachments/date-picker/date-picker.png)

Expand Down Expand Up @@ -116,7 +116,7 @@ Placeholder text will not be displayed if a native date picker is available (tha

{{% snippet file="refguide/visibility-section-link.md" %}}

## 9 Read More
## 3 Read More

* [Data View](data-view)
* [Attributes](attributes)
6 changes: 3 additions & 3 deletions content/refguide/drop-down.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ A drop down must be placed in a [data widget](data-widgets) and displays an attr
A drop down should not be confused with a [reference selector](reference-selector), which is used to select an [association](associations) to another object.
{{% /alert %}}

For example, the following drop down allows the end-user to see, and set, the **Region** to which a customer is allocated.
For example, the following drop down allows the end-user to see, and set, the **Region** to which a customer is allocated. The possible values for **Region** are held in an enumeration.

![](attachments/drop-down/drop-down.png)

Expand Down Expand Up @@ -83,7 +83,7 @@ Empty option caption is the text that is shown for the empty option in the drop-

Adding a caption for the empty option improves the user experience of your application. It also helps end-users using a screen-reader to operate the application easily.

For example, the drop-down that allows the end-user to select the region allocated to a customer could have a caption `Select a region`.
For example, the drop-down that allows the end-user to select the region allocated to a customer, where the possible values for **Region** are held in an enumeration, could have the caption `Select a region`.

![](attachments/drop-down/select-a-region.png)

Expand All @@ -99,7 +99,7 @@ For example, the drop-down that allows the end-user to select the region allocat

{{% snippet file="refguide/visibility-section-link.md" %}}

## Read More
## 3 Read More

* [Data View](data-view)
* [Attributes](attributes)
20 changes: 10 additions & 10 deletions content/refguide/input-widgets.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,41 +16,41 @@ For example, the input widgets can be placed inside a [data view](data-view):

![Data view containing widgets](attachments/input-widgets/data-view.png)

There are several different input widgets, these are used for different [data types](data-types) and for different types of [association](). The input widgets category contains the following widgets:
There are several different input widgets, these are used for different [data types](data-types) and for different types of [association](association-properties). The input widgets category contains the following widgets:

* [**Text Box**](text-box) – displays and, optionally, allows the user to add or edit, text data from a *numeric* or *string-like* attribute:
* [**Text Box**](text-box) – displays and, optionally, allows the end-user to add or edit text data from a *numeric* or *string-like* attribute:

![Text box containing Name attribute](attachments/input-widgets/text-box.png)

* [**Text Area**](text-area) – displays and, optionally, allows the user to add or edit, long text data from a *string* attribute:
* [**Text Area**](text-area) – displays and, optionally, allows the end-user to add or edit long text data from a *string* attribute:

![Text area containing notes attribute](attachments/input-widgets/text-area.png)

* [**Drop Down**](drop-down) – shows the current value of and, optionally, allows users to pick an option from, a list of options in an *enumeration* attribute:
* [**Drop Down**](drop-down) – shows the current value of and, optionally, allows end-users to pick an option from a list of options in an *enumeration* attribute:

![Drop down containing region attribute](attachments/input-widgets/drop-down.png)

* [**Check Box**](check-box) – shows the current value of and, optionally, allows users to set, a *Boolean* attribute to `true` or `false`:
* [**Check Box**](check-box) – shows the current value of and, optionally, allows end-users to set a *Boolean* attribute to `true` or `false`:

![Check box showing personal attribute](attachments/input-widgets/check-box.png)

* [**Radio Buttons**](radio-buttons) – shows the current value of and, optionally, allows users to pick an option from, a list of options in an *enumeration* attribute or the value of a *Boolean* attribute:
* [**Radio Buttons**](radio-buttons) – shows the current value of and, optionally, allows end-users to pick an option from a list of options in an *enumeration* attribute or the value of a *Boolean* attribute:

![Radio buttons showing the preferred contact time and personal attributes](attachments/input-widgets/radio-buttons.png)

* [**Date Picker**](date-picker) – shows and, optionally, allows users to pick, a *DateAndTime* attribute from a calendar:
* [**Date Picker**](date-picker) – shows and, optionally, allows end-users to pick a *Date and time* attribute from a calendar:

![Date picker showing the last contacted attribute](attachments/input-widgets/date-picker.png)

* [**Reference Selector**](reference-selector) – shows and, optionally, can be used to select a *one-to-one* or single *one-to-many* association, selected from the value of a *string*, *numeric*, *enumeration*, or *Data and Time* attribute on the associated object:
* [**Reference Selector**](reference-selector) – shows and, optionally, allows end-users to select a *one-to-one* or *one-to-many* association using the value of a *string*, *numeric*, *enumeration*, or *Date and time* attribute on the associated object:

![Reference selector showing company name attribute of associated company](attachments/input-widgets/reference-selector.png)

* [**Reference Set Selector**](reference-set-selector) – lists with one or more attributes from and, optionally, allows the user to add and remove, associated objects linked via a *many-to-many* association:
* [**Reference Set Selector**](reference-set-selector) – lists with one or more attributes and, optionally, allows the end-user to add and remove associated objects linked via a *many-to-many* association:

![Reference set selector showing details of associated products](attachments/input-widgets/reference-set-selector.png)

* [**Input Reference Set Selector**](input-reference-set-selector) – shows using an attribute from and, optionally, allows the user to add and remove, associated objects linked via a *many-to-many* association:
* [**Input Reference Set Selector**](input-reference-set-selector) – shows an attribute from and, optionally, allows the user to add and remove associated objects linked via a *many-to-many* association:

![Input reference set selector showing the name attribute of associated products](attachments/input-widgets/input-reference-set-selector.png)

Expand Down
4 changes: 1 addition & 3 deletions content/refguide/radio-buttons.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,9 @@ tags: ["studio pro"]

{{% alert type="warning" %}}The radio buttons widget is not supported on native mobile pages.{{% /alert %}}

The **Radio Buttons** widget is an [input widget](input-widgets) that can be used to display and edit Boolean and enumeration attributes.

**Radio Buttons** are used to display and, optionally, allow the end-user to edit the value of an attribute of [data type](data-types) *Boolean* or *Enumeration*.

When the page is displayed to the end-user, all the possible values are listed with a filled-in circle next to the selected value and an empty circle next to the unselected value(s). Only one value can be chosen – choosing another value deselects the current value. For example:
When the page is displayed to the end-user, all the possible values are listed, with a filled-in circle next to the selected value and an empty circle next to the unselected value(s). Only one value can be chosen – choosing another value deselects the current value. For example:

![](attachments/radio-buttons/radio-buttons-displayed.png)

Expand Down
18 changes: 8 additions & 10 deletions content/refguide/reference-selector.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ A **reference selector** is used to display and, optionally, allow the end-user

A reference selector must be placed in a [data widget](data-widgets). The object(s) retrieved by that widget must be at the *many* end of a one-to-many association, or at either end of a one-to-one association.

For example, if you have an employee they will work for one company. A company can have many employees. The entities **Employee** and **Company** have a one-to-many association, **Employee_Company**, which you can select from the Employee through the reference selector.
For example, if you have an employee they will work for one company. A company can have many employees. The entities **Employee** and **Company** have a one-to-many association, **Employee_Company**, which you can select by choosing a Company from the Employee through the reference selector.

![](attachments/reference-selector/reference-selector-domain-model.png)

Expand All @@ -23,14 +23,14 @@ For example, the following reference allows the end-user to see, and set, the as
![](attachments/reference-selector/reference-selector.png)

{{% alert type="info" %}}
If you only want to _display_ information, you can also use a [text box](text-box). This has the added advantage that you can follow more than one association step.
If you only want to _display_ information, you can also use a [text box](text-box). This has the added advantage that you can choose an attribute from an object which is linked via several association steps.
{{% /alert %}}

## 2 Properties

An example of text area properties is represented in the image below:

{{% image_container width="250" %}}![](attachments/reference-selector/reference-selector-properties.png)
{{% image_container width="400" %}}![](attachments/reference-selector/reference-selector-properties.png)
{{% /image_container %}}

Text box properties consist of the following sections:
Expand Down Expand Up @@ -91,7 +91,7 @@ The formatting section applies only to the way that numeric attributes are displ
* Integer
* Long

{{% todo %}}[ Need to do something about numeric formatting]{{% /todo %}}
{{% todo %}}[Need to do something about numeric formatting]{{% /todo %}}

{{% snippet file="refguide/numeric-formatting.md" %}}

Expand All @@ -108,7 +108,7 @@ The reference selector allows the end user to select objects by using either a d
| Drop-down *(default)* | Select the reference using a drop-down. |
| Page | Select the reference using a pop-up page. |

* The advantage of a selecting using a drop-down is that it is very efficient – the end-user can choose with fewer keystrokes as all the information is on the same page.
* The advantage of selecting using a drop-down is that it is very efficient – the end-user can choose with fewer keystrokes as all the information is on the same page.
* The advantage of selecting using a page is that the end-user can search the objects, and more information about each object can be displayed – if there are a lot of objects (say, more than 20) to select from, we suggest selecting is done using a page.

**Select Using Drop-down**
Expand Down Expand Up @@ -139,14 +139,12 @@ This is only displayed if [Select using](#select-using) is set to **Page**. Cons

The select page property determines which page is opened when the select page button is used.

This page can be used to select associated objects from the list of all possible objects. This page should contain a data grid, template grid or list view connected to the same entity as the input reference set selector.
This page can be used to select an associated object from the list of all possible objects. This page should contain a data grid, template grid or list view connected to the same entity as the input reference set selector.

It is recommended that you generate a new page to show by right-clicking the widget and selecting **Generate select page…**.
It is recommended that you generate a new page to show by right-clicking the widget and selecting **Generate select page…**. You can then edit the resulting page, if required.

![Generate a select page by right-clicking the widget](attachments/reference-selector/generate-select-page.png)

You can then edit the resulting page, if required.

See [Opening Pages](opening-pages). Note that opening select pages in content is prohibited.

**Page title**
Expand Down Expand Up @@ -262,7 +260,7 @@ The sort order specifies the order in which the items in the reference selector
A microflow can only be used if the selection is made using a drop-down.
{{% /alert %}}

If the source is microflow is selected, a microflow is called, and returns the list of objects that the reference selector will show.
If the source microflow is selected, a microflow is called, and returns the list of objects that the reference selector will show.

**Microflow**

Expand Down
2 changes: 1 addition & 1 deletion content/refguide/text-area.md
Original file line number Diff line number Diff line change
Expand Up @@ -134,7 +134,7 @@ It can be used, for example, to give a hint to the end-user what kind of text sh

{{% snippet file="refguide/visibility-section-link.md" %}}

## Read More
## 3 Read More

* [Data view](data-view)
* [Attributes](attributes)
2 changes: 1 addition & 1 deletion content/refguide/text-box.md
Original file line number Diff line number Diff line change
Expand Up @@ -154,7 +154,7 @@ It can be used, for example, to give a hint to the end-user what kind of text sh

{{% snippet file="refguide/visibility-section-link.md" %}}

## Read More
## 3 Read More

* [Data Types](data-types)
* [Data View](data-view)
Expand Down
2 changes: 1 addition & 1 deletion snippets/refguide/common-section-link.md
Original file line number Diff line number Diff line change
@@ -1 +1 @@
For more information on properties of this section, see the [Common Section](common-widget-properties#common-properties) section in *Properties Common for Widgets*.
For more information on properties in this section, see the [Common Section](common-widget-properties#common-properties) section in *Properties Common for Widgets*.
5 changes: 2 additions & 3 deletions snippets/refguide/custom-date-format-tokens.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,10 @@ All examples are for **30th December 2014, at 00:27:16.789**
| E, EE | 05 | Day of week number |
| EEE | Tue | Day of week abbreviation|
| EEEE | Tuesday | Day of week name |
| z, zz, zzz, zzzz | Pacific Standard Time | Time zone |
| Z, ZZ, ZZZ | -04:00 | Time zone offset |
| ZZZZ | GMT-04:00 | Time zone offset |
| ZZZZ | GMT-04:00 | Time zone offset and standard |

<sup><small>*</small></sup>two characters pads with zero
<sup><small>*</small></sup><em>two characters pads with zero</em>

These are some examples:

Expand Down

0 comments on commit b097ffa

Please sign in to comment.