Reference Guide
Detailed explanations of every feature and function in NutshellNumber Field
The Number component allows you to capture numeric information within a form, including automatic validation.
Number fields should be used for numbers that might later be used in mathematical calculations
Whilst Number fields can accommodate any type of numeric content you want to collect, Nutshell provides automatic validation for the following types of data:
Integer
For whole numbers – for example, your age.
Decimal
For numbers including a specified number of decimal places.
Required Fields
If a number field in your form is mandatory, Nutshell can automatically validate that an end-user has not left it blank. Just set the number field to be a required field, and Nutshell will do the rest.
Nutshell will not allow the end-user to progress until all required fields have a value
Validation
Nutshell provides automatic validation for numeric data, you shouldn’t need to do anything more than enabling validation.
Nutshell will automatically detect invalid user input and present an error message
Advanced users can validate against custom rules. For example, if your organisation uses custom SKUs or codes that follow a specific pattern, you can make sure they’re entered correctly into your app.
Custom validation rules are defined using Regular Expressions. If you don’t know what a Regular Expression is, you can find out more about them on WikipediaFind more information here or ask a member of your IT team.
How to write Regular Expressions is beyond the scope of this document, but suffice to say that you can enter a Regular Expression, and set a custom error message to display if the end-user’s input doesn’t match.
Default Content
Normally, if your form is just capturing data, the number field will be empty by default. Sometimes, it’s helpful to auto-populate fields with dynamic values. What do we mean by dynamic? Dynamic data is content that changeable based on something your end-user does.
Anywhere you see the blue thunderbolt, you can insert content dynamically from a data-source
You can set the default value of your number field to:
- The content of a form field on another screen (it must be a screen that the end-user will have already passed before reaching the current one)
- The content of a field within a database record (you’ll be able to set the search criteria to determine exactly which record)
- The content of a Variable (you’ll be able to choose which one)
Use the familiar lightning bolt button next to the Default Content field to select the data-source.
Read-only
Sometimes, you’ll need to display data – for example, in an edit form – which should not be edited. When you set a number field to be read-only, your data will be displayed but not editable by the end-user.
Decimal Places
By default, number fields are integers – whole numbers. If you’d like your end-user to input a decimal value – for example, a price – you can specify how many decimal places must be entered.
Resizing a Number Field
To resize a number field component, click and drag on a corner of its bounding box. A number field can only be resized horizontally. The height of a number field is adjusted by changing the text-size, padding and margins.
Number Field Properties
When a Number field component is selected on the Canvas, the following settings are available in the Properties panel:
| Basic Settings | |
|---|---|
| Reference | A unique identifier for the Number field. This is critical, as it allows you to reference the Number field directly when mapping to and from a Data component, or inserting data into emails and documents. |
| Placeholder/Label | If you choose not to use a separate label for this number field, you can have the label appear as a placeholder within the field itself. It is recommended that you use a separate label if possible, as the placeholder disappears as soon as the end-user starts typing into the number field. |
| Default Content | If your number field should already have a value in it when the screen loads, you can specify it here. Default content can either be typed by hand in the properties panel, or dynamically populated using a data-source. Use the lightning bolt button to specify the source. |
| Minimum Value | If you’d like to make sure your end-users input a minimum value into this number field, enter the minimum value here. If this option has a value, Nutshell will validate your end-user’s input regardless of whether validation is turned on. If this option is left blank, it is simply ignored. |
| Maximum Value | If you’d like to make sure your end-users don’t input a value higher than a specific number, enter the maximum number here. If this option has a value, Nutshell will validate your end-user’s input regardless of whether validation is turned on. If this option is left blank, it is simply ignored. |
| Decimal Places | If this option is enabled, your end-user’s input will be validated regardless of whether validation is turned on, and must contain the correct number of decimal places. |
| Read-only | If this option is turned on, the number field will not be editable. This is useful when editing records where some information is allowed to change, and other information should not change. |
| Validation Settings | |
|---|---|
| Required Field | If enabled, Nutshell will not allow the end-user to progress along the workflow until this field has a value. |
| Validate Field | If enabled, Nutshell will not allow the end-user to progress along the workflow until this field has a value that matches the given validation rules. |
| Automatic | Available if Validate Field is enabled. If this option is enabled, Nutshell will validate an end-user’s input automatically for you. |
| Custom | Available if Validate Field is enabled. If your number field is collecting data in a custom pattern, you can specify that pattern using a Regular Expression, and define an error message that will display if the end-user’s input does not match. |
| Styling | |
|---|---|
| Various | A host of options to style your number field, that should be pretty familiar if you’ve ever used a basic document editor like Microsoft Word. |
Just getting started? Try the Tutorials section for handy quick-start guides.
Prefer to watch the action? Try our series of short video tutorials.
Can't find what you're looking for?
If you can't find the answer to your problem here, please contact Nutshell's support team via our dedicated help desk.
Floor 1, Baltimore House
Gateshead, Tyne and Wear
NE8 3DF
United Kingdom