String input with suggest list

Note

The task interface configuration guide describes the features of the HTML/JS/CSS editor. You can also try creating a task interface in Template Builder.

Contains text suggestions that are displayed when the Toloker points the cursor at the input field. There are two types of text suggestions:

  • Universal suggestions used in all tasks.

  • Individual suggestions for different tasks.

Universal suggestions
Individual suggestions
  1. Set the array of suggestion strings in the JS code (getTemplateData method) to include it in the project'sinput data set:

    Example 1
    Example 2
  2. Add the {{field type="suggest" name="<output field name>" source=<array name>}} component to the HTML code. Example:

{{field type="suggest" name="result" source=countries allowCustomInput=true}}

Parameters

ParameterDescriptionRequiredDefault value
typeField type: suggest — String input field with suggestions.yesno
nameAttribute for the output data field. Contains the output field name.yesno
sourceName of array with suggested strings. For example: source=countries. The array is defined in the JS-code of the project ( getTemplateData method).yesno
allowCustomInputWhether the Toloker can ignore suggestions and enter their own string.nofalse
validation-show

The position of popup hints (displayed if the response didn't pass validation). The position is relative to the input field.

Supported values:

  • Above the input field: "top-left", "top-center", "top-right".

  • Below the input field: "bottom-left", "bottom-center", "bottom-right".

  • To the left of the input field: "left-top", "left-center", "left-bottom".

  • To the right of the input field: "right-top", "right-center", "right-bottom".

  • Don't display the message ("false").

no"top-left"
placeholder

The text to display in the empty field.

Note

If value is set, the input field shows value instead of placeholder.

nono
hotkeyShortcut for setting focus on the field.nono
value

The value to write in responses if the Toloker didn't fill in the field.

Note

Value is displayed in the empty field instead of placeholder.

nono
classThe CSS class for the field. For example: class="mytask_field".no".field" ".field_type_suggest"
Contact support

Last updated: February 15, 2023

Introduction
Getting started
Important tips
Useful recommendations
Working with Toloka
Projects
Pools
Tasks
Results
Project analysis
Toloka settings
Task interface
Template Builder
HTML/CSS/JS editor
Help and support
FAQTroubleshootingSupportGlossary