String input with suggest list

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;
}

Example

exports.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