Skip to main content

Phone

What is the Form Phone?​

The Phone form type is a telephone number input with a country selector. It shows the country's flag and dial code, formats the number as it is typed according to the selected country, and exports the number in international format.

phone.png

Options​

Default country​

  • The country shown when the field first renders. It determines the flag, the dial code, and the formatting/validation rules applied to the typed number.
  • Selected from a full list of countries (every entry maps to an ISO 3166-1 alpha-2 code, for example HU, GB, US).
  • Changing this value in the editor updates the displayed country live.
  • Default: HU (Hungary).

Allow selector​

  • Controls whether the viewer can change the country.
  • When enabled, a dropdown chevron is shown next to the flag and the viewer can pick a different country, which switches the dial code and the formatting rules.
  • When disabled, the chevron is hidden, the selector becomes non-interactive, and the country stays fixed to the configured Default country.
  • Default: true (enabled).

Font size multiplier​

  • A slider that multiplies the base font size (the General Font size, default 14px) used by the input text and the dial code.
  • Range: 0.1 to 5, step 0.1.
  • Default: 1.

Setting Mock Field and Own Value​

The Phone field writes its value when the input loses focus (on blur).

  • The Own value is always the number in international format (for example +36 1 234 5678).
  • The value written to the Mock datasource depends on the General Export type:
    • Simple: the international-format string.
    • Complex: the full number object, which contains number, region, type, valid, possible, possibility, and canBeInternationallyDialled.
  • Each write also stores the defaultCountry and allowSelector properties.
  • When the field is rendered and no stored value exists, an empty value is written to the Mock datasource (the Own value is not set until the first blur).

Validation​

The Phone field does not validate. It never marks itself valid or invalid and does not emit a {FORM-NAME}-valid event. (In Complex export the stored object still carries the library's own valid and possible flags, but these do not drive form validation.)

Sensor Events​

  • The Phone field does not validate, so it does not send a {FORM-NAME}-valid event.

  • Whenever the value is written, the field broadcasts a sensor event named after the field, carrying the exported value:

    {FORM-NAME} value: [phone value]
    • {FORM-NAME} is the name assigned to the field.
    • The value is the international-format string (Simple export) or the number object (Complex export).
    • This is suppressed when the change comes from a silent Reset or silent Clear.

External Messages​

  • Set Form: Not supported on the Phone type. The command is ignored and a warning is logged.
  • Clear Form: Empties the input and writes an empty value to the Mock and Own values.
  • Reset Form: Behaves the same as Clear Form, emptying the input and writing an empty value.

The silent variants of Clear and Reset do the same but suppress the {FORM-NAME} sensor event.

Value from Datasource​

  • The Phone field does not build its content from an external (bound) datasource array.
  • On mount, if the bound form output datasource already holds a value for this field, the input is pre-filled with it. The portion up to and including the first space (the leading dial-code segment) is stripped, since the country selector supplies the dial code.
Last updated on