Multiline text input fields

A multline text input field stores a string as its value and a string as its text. Its value is always a valid string, while its text could be any string entered into its editor. Unlike a text input field, this field also supports newline characters entered in the editor.

Multiline text input field

Multiline text input field with editor open

Multiline text input field on collapsed block

Creation

JSON

{
  "type": "example_multilinetextinput",
  "message0": "multiline text input: %1",
  "args0": [
    {
      "type": "field_multilinetext",
      "name": "FIELDNAME",
      "text": "default text\n with newline character",
      "spellcheck": false
    }
  ]
}

JavaScript

Blockly.Blocks['example_multilinetextinput'] = {
  init: function() {
    this.appendDummyInput()
        .appendField("multiline text input:")
        .appendField(new Blockly.FieldMultilineInput('default text\n with newline character'),
            'FIELDNAME');
  }
};

The multiline text input constructor takes in an optional value and an optional validator. The value should cast to a string. If it is null or undefined, an empty string will be used.

The JSON definition also allows you to set the spellcheck option.

Serialization and XML

The XML for a multiline text input field looks like so:

<field name="FIELDNAME">text</field>

Where the field's name attribute contains a string referencing a multiline text input field, and the inner text is the value to apply to the field. The inner text value follows the same rules as the constructor value.

Customization

Spellcheck

The setSpellcheck function can be used to set whether the field spellchecks its input text or not.

Text input fields with and without spellcheck

Spellchecking is on by default.

This applies to individual fields. If you want to modify all fields change the Blockly.FieldMultilineInput.prototype.spellcheck_ property.

Creating a text input validator

A multiline text input field's value is a string, so any validators must accept a string and return a string, null, or undefined.

Here is an example of a validator that removes all 'a' characters from the string:

function(newValue) {
  return newValue.replace(/a/gm, '');
}