String input with suggest list
- Universal suggestions used in all tasks.
- Individual suggestions for different tasks.
Set the array of suggestion strings in the JS code (
getTemplateData
method) to include it in the project's input data set:exports.Task = extend(TolokaHandlebarsTask, function (options) { TolokaHandlebarsTask.call(this, options); }, { getTemplateData: function() { var data = TolokaHandlebarsTask.prototype.getTemplateData.apply(this, arguments); data. < array name > = ['string 1', 'string 2', ... 'string n' ]; return data; }, OnRender: function () { //Generated DOM element for the task (available via #getDOMElement()) }, onDestroy: function () { //The task is completed, you can release global resources (if you used them) } }); function extend(ParentClass, constructorFunction, prototypeHash) { constructorFunction = constructorFunction || function () {}; prototypeHash = prototypeHash || {}; if (ParentClass) { constructorFunction.prototype = Object.create(ParentClass.prototype); } for (var i in prototypeHash) { constructorFunction.prototype[i] = prototypeHash[i]; } return constructorFunction; }
Exampleexports.Task = extend(TolokaHandlebarsTask, function (options) { TolokaHandlebarsTask.call(this, options); }, { getTemplateData: function() { var data = TolokaHandlebarsTask.prototype.getTemplateData.apply(this, arguments); data.countries = ['Poland', 'Lithuania', 'Russia', 'Belarus', 'Latvia', 'Germany', 'France']; return data; }, OnRender: function () { //Generated DOM element for the task (available via #getDOMElement()) }, onDestroy: function () { //The task is completed, you can release global resources (if you used them) } }); function extend(ParentClass, constructorFunction, prototypeHash) { constructorFunction = constructorFunction || function () {}; prototypeHash = prototypeHash || {}; if (ParentClass) { constructorFunction.prototype = Object.create(ParentClass.prototype); } for (var i in prototypeHash) { constructorFunction.prototype[i] = prototypeHash[i]; } return constructorFunction; }
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}}
Copied to clipboard
Add the
{{field type="suggest" name="<output field name>" source=<input field name>}}
component to the HTML code. Example:{{field type="suggest" name="result" source=countries allowCustomInput=true}}
Copied to clipboardAdd a field of array string type in the description of input data. Example:
{ "counries": { "type": "array_string", "required": true } }
Copied to clipboard
- Parameters
-
Parameter
Description
Required
Default value
type
Field type:
suggest
— String input field with suggestions.yes
no
name
Attribute for the output data field. Contains the output field name.
yes
no
source
Name of array with suggested strings. For example:
source=countries
. The array is defined in the JS-code of the project (getTemplateData
method).yes
no
allowCustomInput
Whether the performer can ignore suggestions and enter their own string.
no
false
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. Ifvalue
is set, the input field showsvalue
instead ofplaceholder
.no
no
hotkey
Shortcut for setting focus on the field.
no
no
value
The value to write in responses if the performer didn't fill in the field.
Note.Value
is displayed in the empty field instead ofplaceholder
.no
no
class
The CSS class for the field. For example:
class="mytask_field"
.no
".field" ".field_type_suggest"
Parameter
Description
Required
Default value
type
Field type:
suggest
— String input field with suggestions.yes
no
name
Attribute for the output data field. Contains the output field name.
yes
no
source
Name of array with suggested strings. For example:
source=countries
. The array is defined in the JS-code of the project (getTemplateData
method).yes
no
allowCustomInput
Whether the performer can ignore suggestions and enter their own string.
no
false
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. Ifvalue
is set, the input field showsvalue
instead ofplaceholder
.no
no
hotkey
Shortcut for setting focus on the field.
no
no
value
The value to write in responses if the performer didn't fill in the field.
Note.Value
is displayed in the empty field instead ofplaceholder
.no
no
class
The CSS class for the field. For example:
class="mytask_field"
.no
".field" ".field_type_suggest"