spring model binding with disabled input

Question

sorry for a dumb question but i can't understand quite what happens, and if it is what i suspect.. well i am really at a loss. i am using spring boot + thymeleaf + materialize css to show and validate a form. now what i don't meet in many examples that i see is this case:

some form fields are pre-filled and should seem disabled to the client, showing their pre-filled values. this pre-filling takes place in the controller, while i handle some other request, and redirect to this view

i am binding a pojo to the form using th:object like this

<form id="register_form" action="#" th:action="@{/showform}" th:object="${userInfo}" method="post">
 <div class="input-field">
   <label th:text="#{label.surname}" for="surname"></label>
   <input type="text" th:field="*{surname}" id="surname" th:attr="value=${userInfo.surname}" />
 </div>
 <div class="input-field">
   <label th:text="#{label.name}" for="givenname"></label>
   <input type="text" th:field="*{givenname}" id="givenname" th:attr="value=${userInfo.givenname}" disabled="disabled" />
 </div></form>

and getting it in the POST handler of the controller like this:

@RequestMapping(value = {"/showform"}, method = RequestMethod.POST)
public ModelAndView submitFormPage(@ModelAttribute("userInfo") @Valid UserInfo userInfo, 
      BindingResult bindingResult, RedirectAttributes redir) 
{      
  ModelAndView mview = new ModelAndView();

  if (bindingResult.hasErrors()) 
  {
     // show form again with error messages
     mview.addObject("userInfo", userInfo);
     mview.setViewName("/showform");
  }
  else 
  {
     // ...
  }

  return mview;
}

RedirectAttributes is there for some other reason. As you can see, there are two elements on a form, and first one is enabled, and the second disabled. Their values are populated correctly with pre-filled values from the POJO i pass to the view via the ModelMap. i can also trace it in the GET handler.

but the ModelMap i get back from the view contains the aforementioned POJO with NULL values in place of the elements that are bound to the disabled controls. i would expect them to be populated by the contents of the value attribute, even though those controls are disabled. the enabled controls carry their values alright.

or is it just that disabled controls simply are not included in the postback? if this is the case, how would you suggest me to do it? some suggested adding an obscure CSS that would "fake" the behaviour of a disabled control. or have i missed something in the general wiring?

i think with horror of possible workarounds - but i must be doing something wrong.. th:attr was one of the workarounds i tried, but it doesn't seem to do the trick. i also tried using th:id and th:disabled but it didn't help either.

Answer 1

There is a misunderstanding here I think about the use of disabled.

A readonly element is just not editable, but gets sent when the according form submits. a disabled element isn't editable and isn't sent on submit. Another difference is that readonly elements can be focused (and getting focused when "tabbing" through a form) while disabled elements can't.

More detailed comparison

So to answer your question: you should opt for readonly if you want to bind your attributes to your pojo and still the user can't edit them.