OS Grid Ref Field

Text input for collecting an Ordnance Survey grid reference.

This component renders an inline Ordnance Survey map that lets users click a location to auto-populate the grid reference input. The map requires the ordnanceSurveyApiKey and ordnanceSurveyApiSecret plugin options to be set — without them the component falls back to a plain text input.

Preview

This component is progressively enhanced. The OS grid reference field works without JavaScript. With JavaScript enabled, an interactive map lets users click to set their location.

To see the full experience, view our demo form which includes most components.

Enter an OS grid reference

Map appears here with JavaScript enabled

JSON definition

{
  "type": "OsGridRefField",
  "name": "fieldName",
  "title": "Question title",
  "hint": "",
  "shortDescription": "",
  "options": {}
}

Properties

Property	Type	Required	Description
`hint`	`string`	No	Hint text displayed below the field label to help the user answer the question.
`shortDescription`	`string`	No	A short description of the field used in the check-your-answers summary.

Options

Property	Type	Required	Description
`classes`	`string`	No	Additional CSS classes applied to the component.
`condition`	`string`	No	Name of a condition that controls whether this component is shown.
`customValidationMessage`	`string`	No	A single custom message shown for any validation error on this field.
`customValidationMessages`	`object`	No	A map of Joi error codes to custom error messages.
`instructionText`	`string`	No	Alternative text read by screen readers in place of the field title.
`optionalText`	`boolean`	No	When `true`, appends '(optional)' to the field label.
`required`	`boolean`	No	Whether the field must be filled in. Defaults to `true`.