# Required Fields

The next pro plugin feature is the capability of adding the required field of some calculator elements. In general, a **required field** is an input field on a form that must have a non-blank value to be valid before submitting a form. 

![](https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2Fyzd6Inujb5mh5qYjlvAo%2FCCBN%20required%20elems.png?alt=media\&token=865a8dcc-847c-47de-a378-ae1c9216fef2)

The element with the required field comes with a red asterisk symbol (![REQUIRED](https://community.pega.com/sites/default/files/help_v55/shared/requiredstar.gif)) in the calculator form. 

{% hint style="success" %}
Calculator elements **Checkbox, Radio button, Toggle button, Quantity, and Dropdown** have the required field option that can be enabled in the element creation. 
{% endhint %}

{% hint style="warning" %}
**Checkbox, Radio button, and Toggle button** elements need to be filled with options, if no option is chosen, a notification message will appear like "This field is required". 
{% endhint %}

**Checkbox, Radio button, Toggle button, File** elements' examples with a notification message:

![](https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2Fn4pN64lt7HJhPMnjc9Ch%2FCCBN%20required%20one.png?alt=media\&token=0ad1d974-c55a-4aa6-a9ed-7664d73702fa)

{% hint style="warning" %}
The **Dropdown** element required field will be shown if the user does not select any values. The **Quantity** element required field notification message will be shown if the quantity is zero ( 0 ).
{% endhint %}

**Dropdown, Quantity** elements' examples with a notification message:

![](https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FR0UneACyypcotbBhtlEB%2FCCBN%20required%20two.png?alt=media\&token=82624b25-5f0d-40c9-adfd-8c52438c55f6)

The notification message content can be changed in the Calculator Settings: **Settings >** Notifications

![](https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FNQXqoJN5p94qTSc0V7Ex%2FCCBN%20required%20fields.png?alt=media\&token=e66af25d-109b-48b5-b8cb-9f2fc9977fc3)

{% hint style="danger" %}
The required field works only when the calculator form has the submit function. The calculator without the submit button will not work. Submitting a form function is available when you enable contact form or WooCommerce or Stripe or PayPal options in the Settings.
{% endhint %}

#### Sample Calculator with required field feature:

There has been created a sample calculator with elements that have the required field:

![](https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FHQ22ZWWgRrUfLr8YtQUw%2FCCBN%20required.jpg?alt=media\&token=3c663008-7ca5-4926-b08c-4ba9db3495cf)

For each created element in this calculator contain the toggle button for enabling the required field option, you need to enable that option and save your work:

![](https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FZooTbiV39YfrQ77YXqPw%2FCCBN%20required%20set.jpg?alt=media\&token=ad85861b-e8e4-462e-ba50-1d056119b1f4)

As the required field works only when there is the submit function in the calculator, after creating the desired calculator, you need to check the submit option in the Settings:

![](https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2F3VL9KClNllNEOKI1iyi6%2FCCBN%20enable%20contact%20form.png?alt=media\&token=e11e0f3c-b1bd-49a5-8bfd-e118b90c3934)

The main thing for the required field works properly is that there should be a submit button in the calculator:

![](https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FP4WCeaAexQyCTX8F08Ml%2FCCBN%20required%20els.png?alt=media\&token=f931163b-3109-4304-b040-8b042d9a1985)

Because after clicking the submit button, the required field does not allow non-chosen elements that have the required field is enabled.

![](https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2Fyzd6Inujb5mh5qYjlvAo%2FCCBN%20required%20elems.png?alt=media\&token=865a8dcc-847c-47de-a378-ae1c9216fef2)