Linked Open Input Component
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:
Add a Component
Explore everything there is to know about Evolve. This collection begins with the basics of Evolve and completes with information on the tool's more advanced features. Feel free to start from the beginning or hop around to the specific section that suits your needs.
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:
Add Linked Open Input Title, or a Linked Open Input Display Title, as needed. Linked Open Input Display Title is seen by learners.
Scroll down the page and add your Linked Open Input Body. Use the text editor to style and format your text, as needed.
- Add Linked Open Input Instruction Text that tells users how to use the component.
- 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
In the Linked Open Inputs section, you Add Linked Items to your Linked Open Input component.
For each Linked Item:
- 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.
- Set Linked open input incomplete message. This message is shown if the linked open input is not yet completed.
- 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.
- 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
- In the Input section, enter some Placeholder text that the learner will see inside the input box.
- Enter Save button Text that will be shown on the save button.
- Enter the Save success message showing when the learner's further text input is saved.
- Enter Clear button Text.
- Add Text Input ARIA Label, as needed.
- Add Saved ARIA Live Message, as needed.
- Add Cleared ARIA Live Message, as needed.
Behavior section
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.
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
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.