# 10. Input Validation
At the moment there's nothing stopping you from creating a blank item on the "Add New Item" view our the Punch List app. That's where **Input Validations** come into play. To force the user to enter something in an input component, set its `required` property to `true`, and then set the `validate` property of the *button* to `true` as shown below in the `add_new.xml` file:
```xml
```
When the user presses the button, all of the input components that have `required` set to `true` will be validated first, before the action that the button is supposed to trigger takes place.
### Test App on Device
Sync your app to ensure it has the latest code update and try to add a blank punch list item. You'll see that invalid fields are highlighted as seen below:
{% tabs %}
{% tab title="Desktop" %}
{% endtab %}
{% tab title="Mobile" %}
{% endtab %}
{% endtabs %}
### Custom Validations in JavaScript
Any custom validations that you'd like to perform can be done in the JavaScript. You can create complex logic or business rules in the JavaScript using conditionals, regular expressions, and so on, and then determine whether or not to allow the user to proceed depending on those validations.
### Further Validations for punch List App
Let's force the user to enter at least 5 characters when entering comments for the punch list item they want to save (We realize this is not the most practical validation, but it serves as a good practical example). To do that, we are going to add a custom validation in the **JS** that we will execute before we save and dismiss. Checking the length of the comments field is pretty easy in **JS**, since it is a string we can use the `.length` property. So, we want to validate that the length is at least 5 characters long, if not, we want to give the user a notification telling them what is wrong and also stop the code from saving the item and dismissing.
Therefore, in your `add_new.js`, update your `saveItem()` function to the following:
```javascript
function saveItem() {
if (view.item.comments.length < 5) {
notification.error("Please add more comments");
return;
}
dismiss();
}
```
The condition of the `if` statement will catch all cases where the number of characters in the comments field is less than 5, then it will trigger an error notification with our custom message and finally the `return` statement will exit the function before it reaches our `dismiss()` statement - this ensures the changes are not saved and the user will remain on this view until they fix the problem.
### Test App on Device
Go ahead and try it out on your device. If you try to save an item with fewer than 5 characters in the comments field, you should get an error that looks like this.
### Next Up: View Existing Punch List Items
Next up we want to provide users with the ability to view the details of an existing punch list item and we will be creating a new view called `view_item` to accomplish this. Before we can complete this feature though, we first need to learn about **View Parameters** in the next section.