Have you ever wondered why your web forms all look the same? With boring white rectangular boxes for the user to fill in?

Let's see how to build a more modern form using OutSystems UI available tools.

In this case, we are building a form to save a new house sale for a real estate company.

Sales have attributes, like the profit margin and number of bedrooms.

Let's substitute the number of bedrooms input for a slider. First, delete the existing "input", then create a slider.

Set the property values for the slider like the minimum and maximum values allowed.
Create a handler to be triggered when the user changes the value of the slider.

‍

‍

On that action, we're going to assign the slider value to the aggregate.

‍

The label is no longer assigned to the input widget. Remove it for the error to disappear.

‍

And that's how we have a different and more user-friendly form.

Thanks!