You can use WS Form conditional logic to increase and decrease the value of numeric fields in a WordPress form.
Demo
Tutorial
In this tutorial, we’ll add a number field to a form and then create plus and minus buttons that will increase and decrease the value of that number field.
First we add the fields to the form:
We add a number field and two custom buttons either side of that. You can position the buttons wherever you would like on the form.
Next we need to add some conditional logic that will increase or decrease the number field when a custom button is clicked.
The conditional logic for + custom button is shown below.
This condition adds an event handler to the + custom button. When a click event occurs, the value in the number field is incremented by 1. You can increment by any step you wish and even increase the field by the value of another field by using WS Form variables, e.g. #field(123).
We add a similar condition to the form for the – custom button that uses the Decrease value by condition action.
The final form is shown below.
Limiting Numeric Values
You can you use the Minimum and Maximum settings on numeric based fields to limit the maximum and minimum permissible values that conditional logic can increase or decrease a value by. To do this:
- Edit the field.
- Click on the Advanced tab.
- Enter a value in the Minimum and/or Maximum setting.
- Click Save.
Field Types
The following field types have the Increase value by and Decrease value by conditional actions: