Skip to main content

Outline

This component is suitable for use when creating accessible courses.

The Linked Open Input component allows you to link open inputs together. The Linked Open Input component displays the answer entered in another open input component and allows the learner to add further text.

This article provides an overview of the Linked Open Input component, component setup and behavior, and examples of Linked Open Input component configurations.

Component overview


The Linked Open Input component is an interactive component that lets you link open inputs together. The Linked Open Input component displays the answer entered in another open input component and allows the learner to add further text. The learner needs to complete a selected open input component before the Linked Open Input component can be completed.

The Linked Open Input component is fully responsive and can display custom feedback after submitting some further text.

Component set up


To add this component, follow the steps in this article:

The Property Panel for the newly added component will then open automatically for you to customize set-up.

Or click anywhere on an existing component to open the Property Panel.


General section

In the General section:

Screenshot of General settings

Add Linked Open Input Title, or a Linked Open Input Display Title, as needed. Linked Open Input Display Title is seen by learners.

Screenshot of General settings

Scroll down the page and add your Linked Open Input Body. Use the text editor to style and format your text, as needed.

Screenshot of General settings
  1. Add Linked Open Input Instruction Text that tells users how to use the component.
  2. Include an Aria Label for screen readers, as needed.

Interaction Label section

In the Interaction Label section, you can enable an Interaction Label.

The Interaction Label allows you to add a widget before or after the Linked Open Input component. This widget can display an icon and label prior to the Linked Open Input component completion, which changes to a different icon and label once the Linked Open Input component is completed.

Add Linked Open Input Items


Screenshot of Linked Open Input settings

In the Linked Open Inputs section, you Add Linked Items to your Linked Open Input component.

For each Linked Item:

Screenshot of Linked Open Input settings
  1. Select Open Input that will be linked to this component. This is done by clicking on the Select Components dropdown and selecting what open input component in your Evolve course requires completion and will be linked to this Linked Open Input component.
  2. Set Linked open input incomplete message. This message is shown if the linked open input is not yet completed.
  3. Set Navigate to linked open input button text. This text is shown on a button that navigates to the linked open input for this component.
  4. Enter Linked Answer Label Text. This will be displayed above the linked open input answer.

Add, duplicate, or delete Linked Items as needed.

Component Examples


Below are examples that illustrate the Linked Open Input component setup:

Example 1 – displays the Linked Open Input component before the linked Open Input component has been submitted and the navigation button is activated.

Example 2 – displays the Linked Open Input component after the linked Open Input component has been submitted.

Example 3 – displays the Linked Open Input component after some further text input has been submitted and feedback is shown below the component.

Input section


Screenshot of Input settings
  1. In the Input section, enter some Placeholder text that the learner will see inside the input box.
  2. Enter Save button Text that will be shown on the save button.
  3. Enter the Save success message showing when the learner's further text input is saved.
  4. Enter Clear button Text.
  5. Add Text Input ARIA Label, as needed.
  6. Add Saved ARIA Live Message, as needed.
  7. Add Cleared ARIA Live Message, as needed.

Behavior section


Screenshot of Behavior settings

In the Behavior section, toggle to enable Does Not Require Open Input Completion.

Toggle to disable Should show feedback when saving the answer to the Linked Open Input component. By default, this setting is enabled.

Toggle to Display Feedback Inline. If enabled, Feedback will be displayed below the component instead of a dialog.

Toggle to disable the setting to display Feedback Title. With this setting enabled Feedback will be displayed with the display title of the Open Input component.

Note: Enabling to display Feedback Title will have no effect if Display Feedback Inline is enabled.

Screenshot of Behavior settings

Enter Feedback text that will show once the further text in the Linked Open Input component has been saved. Use the text editor to style and format your text, as needed.

Select a Feedback Image and Set Image Per Device Size as needed.

Add Feedback Image Alt Text and select Feedback Image Position as needed. Feedback Image can be positioned on Top, Bottom, Left, or Right as needed. By default, this is set to Right.

Appearance section


Screenshot of Appearance settings

In the Appearance section, you toggle to Enable Minimum Height. The Minimum Height sets a minimum pixel height on the textarea. By default, the Minimum Height is 300.

Set Linked Answer Background Color as needed.

Set Linked Answer Text Color as needed.

Did this article help?

Let us know by leaving a star rating or review at the top of this article.