How to add default values to input fields in Thymeleaf

问题

I am programming in Spring and using Thymeleaf as my view, and am trying to create a form where users can update their profile. I have a profile page which lists the user's information (first name, last name, address, etc), and there is a link which says "edit profile". When that link is clicked it takes them to a form where they can edit their profile. The form consists of text fields that they can input, just like your standard registration form.

Everything works fine, but my question is, when that link is clicked, how do I add the user's information to the input fields so that it is already present, and that they only modify what they want to change instead of having to re-enter all the fields.

This should behave just like a standard "edit profile" page.

Here is a segment of my edit_profile.html page:

First Name:

Here is the view controller method that returns edit_profile.html page:

@RequestMapping(value = "/edit", method = RequestMethod.GET)
    public String getEditProfilePage(Model model) {
        model.addAttribute("currentUser", currentUser);
        System.out.println("current user firstname: " + currentUser.getFirstname());
        model.addAttribute("user", new User());
        return "edit_profile";
    }

currentUser.getFirstname() prints out the expected value, but I'm getting blank input values in the form.

Thanks.

回答1:

I'm slightly confused, you're adding currentUser and a new'd user object to the model map.

But, if currentUser is the target object, you'd just do:

<input type="text" name="firstname" value="James" th:value="${currentUser.firstname}" />

From the documentation: http://www.thymeleaf.org/doc/tutorials/2.1/usingthymeleaf.html

回答2:

Solved the problem by removing th:field altogether and instead using th:value to store the default value, and html name and id for the model's field. So name and id is acting like th:field.

回答3:

I did not have a form with input elements but only a button that should call a specific Spring Controller method and submit an ID of an animal in a list (so I had a list of anmials already showing on my page). I struggled some time to figure out how to submit this id in the form. Here is my solution:

So I started having a form with just one input field (that I would change to a hidden field in the end). In this case of course the id would be empty after submitting the form.

<form action="#" th:action="@{/greeting}" th:object="${animal}" method="post">
    <p>Id: <input type="text" th:field="*{id}" /></p>
    <p><input type="submit" value="Submit" /> </p>
</form>

The following did not throw an error but neither did it submit the animalIAlreadyShownOnPage's ID.

<form action="#" th:action="@{/greeting}" th:object="${animal}" method="post">
    <p>Id: <input type="text" th:value="${animalIAlreadyShownOnPage.id}" /></p>
    <p><input type="submit" value="Submit" /> </p>
</form>

In another post user's recommended the "th:attr" attribute, but it didn't work either.

This finally worked - I simply added the name element ("id" is a String attribute in the Animal POJO).

<form action="#" th:action="@{/greeting}" th:object="${animal}" method="post"> 
    <p>Id: <input type="text" th:value="${animalIAlreadyShownOnPage.id}" name="id" /></p>                            
    <p><input type="submit" value="Submit" /> </p>
</form>

来源：https://stackoverflow.com/questions/31542032/how-to-add-default-values-to-input-fields-in-thymeleaf

标签

html

Spring

spring-mvc

thymeleaf