HTML5 Thymeleaf - placeholder for input type=number shows 0

Viewed 1584

I'm creating a simple HTML form along with Thymelaf that I use in my Spring Boot application.

In the form I specified a following statement:

<input type="number" step="0.1" min="0" max="10" **th:field="*{rating}"**
                   class="form-control mb-4 col-4" placeholder="Rating">

However, instead of Rating, the value showed in the form is 0.

outcome

Once you delete the 0, placeholder finally appears.

desired_outcome

Edit
Apparently, Thymeleaf seems to cause the problem here.

<input type="number" step="0.1" min="0" max="10" th:field="*{rating}"
                   class="form-control mb-4 col-4" placeholder="Rating">
<input type="number" placeholder="Test Rating"
                   class="form-control mb-4 col-4">

The form without th:field="{rating}"* works fine.

enter image description here

2 Answers

If you don't want the default of 0 you can't use primitive data types as int, long, float and double.

Instead use wrapper class with null for a variable related with th:field="*{rating}" for empty form.

Your code works as expected in plain HTML. Try using th:placeholder attribute instead of placeholder

Related