Problem
Instead of server-side validation, you would like to do client-side validation (javascript-based
validation). You want to check if a text field is empty the moment you move away from it (once the field loses focus), and if it is empty, you want to display an alert.
Solution
Setting up the sample:
1. We will use the form "Sample Customer" that we created from previous tutorial (https://www.workmoji.com/post/retrieving-data-from-another-form).
Solution:
1. Click on the "Advanced settings" button on the left of the "Customer name" field.
2. In the "Javascript" field, click on the "New attribute" link.
3. In the next page, type in the following:
Attribute name: onblur
Javascript code: if (this.value=='') {alert('You left this field empty!');}
The onblur keyword is a Javascript event that refers to the textbox losing focus (clicking/tabbing away from the textbox).
4. Click the "Save changes" button, and click the "Save changes" button again in
the next page.
Running the solution:
1. Publish and run your form.
2. Click on the customer name field, but don't key in anything. Now hit the 'Tab' key, or click away from the control. You should see the alert popup.
3. Try clicking on the customer name field again, but key in something. When you hit the 'Tab' key or click away, the popup does not appear.
Comments