Checkbox

You have to go through a three-step form wizard to enable this Control, i.e., Design, Validation & Advance. Let’s explain these steps below:

1st Step – Design

This is the first step of the “Checkbox” control form wizard. Here you are required to fill in the following details:

1. Database Field Name (mandatory): These are the attributes of the form
2. Label Name
3. Column Width
4. Placeholder
5. Enable Tooltip?: This button is set as “Yes” if you need to enable Tooltip Text in this Control
   1. Tooltip Text
   2. Select Tooltip Position: Select tooltip position from the following Top, Right, Bottom or Left
6. isDefault UI

2nd Step – Validation

1. Use Custom Value?: Values are set as True or False for this Control by default. But you can put any custom Values.
2. Hide Switch Text?: With this property, you can hide the text from the switch.
3. Use Custom Text?: Text is set as Yes or No for this Control by default. But you can put any custom Text.
4. Is Mandatory?: This button is set as “Yes” if you need to apply this Control as mandatory
   1. Error Message: Here, you can define the error message that will be displayed if this control is left blank.
5. Default Value: As the name suggests, it defines a default value for a field. This default value can be changed by user input.

3rd Step – Advance

1. Design
1. Bootstrap Column Class
2. Description: Enter extra suggestions for user experience on this field

2. Mobile
1. Enable Switch Mode
1. Switch align right
2. Background Active
3. Background Inactive
4. Active Text
5. inActive Text
6. Circle Size
7. Bar Height
8. Circle Border Width
9. Circle Active Color
10. Circle InActive Color
11. Inner Circle Style
12. Outer Circle Style
13. Render Active Text
14. Render InActive Text
15. Switch LeftPx
16. Switch RightPx
17. Switch Width Multiplier
18. Switch Border Radius
19. Outer Style

Click “Confirm” and “Checkbox” control is configured.