Spring MVC conversion HOW TO

Question

I have vehicle service that, among other has list of parts. Adding new service is not a problem, viewing of service is not a problem, but when I try to implement edit, it does not preselects the list of parts. So, thinking it is a Thymeleaf issue, I post the question here.

And the answer that I got was to try to implement spring conversion service. I did just that (I think), and now I need help to get me out of this mess. Problem is that view compares instances of parts from service with instances of parts form partsAttribute containing all parts, and never uses converters, so it does not work. I receive no errors... Just in view, parts are not selected. Bellow you will find Converters, WebMVCConfig, PartRepository, ServiceController and html w/ thymeleaf, for your reference. What am I doing wrong???

Converters:

PartToString:

    public class PartToStringConverter implements  Converter<Part, String> {   
    /** The string that represents null. */
    private static final String NULL_REPRESENTATION = "null";

    @Resource
    private PartRepository partRepository;

    @Override
    public String convert(final Part part) {
        if (part.equals(NULL_REPRESENTATION)) {
                return null;
        }
        try {
          return part.getId().toString();
        }
        catch (NumberFormatException e) {
            throw new RuntimeException("could not convert `" + part + "` to an valid id");
        }
    }
}

StringToPart:

public class StringToPartConverter implements  Converter<String, Part> {   
        /** The string that represents null. */
        private static final String NULL_REPRESENTATION = "null";

        @Resource
        private PartRepository partRepository;

        @Override
        public Part convert(final String idString) {
            if (idString.equals(NULL_REPRESENTATION)) {
                    return null;
            }
            try {
              Long id = Long.parseLong(idString);
              return this.partRepository.findByID(id);
            }
            catch (NumberFormatException e) {
                throw new RuntimeException("could not convert `" + id + "` to an valid id");
            }
        }
    }

Relevant parts of WebMvcConfig:

@Configuration
public class WebMvcConfig extends WebMvcConfigurationSupport {
...
    @Bean(name="conversionService")
    public ConversionService getConversionService(){
        ConversionServiceFactoryBean bean = new ConversionServiceFactoryBean();
        bean.setConverters(getConverters());
        bean.afterPropertiesSet();
        ConversionService object = bean.getObject();
        return object;
    }
    private Set<Converter> getConverters() {
        Set<Converter> converters = new HashSet<Converter>();

        converters.add(new PartToStringConverter());
        converters.add(new StringToPartConverter());
        System.out.println("converters added");
        return converters;
    }
}

Part repository looks like this:

@Repository
@Transactional(readOnly = true)
public class PartRepository {

protected static Logger logger = Logger.getLogger("repo");

    @PersistenceContext
    private EntityManager entityManager;

    @Transactional
    public Part update(Part part){
        try {
            entityManager.merge(part);
            return part;
        } catch (PersistenceException e) {
            return null;
        }
    }

    @SuppressWarnings("unchecked")
    public List<Part> getAllParts(){
        try {
            return entityManager.createQuery("from Part").getResultList();
        } catch (Exception e) {
            return new ArrayList<Part>();
        }
    }

    public Part findByID(Long id){
        try {
            return entityManager.find(Part.class, id);
        } catch (Exception e) {
            return new Part();
        }
    }
}

Edit part of ServiceController:

    @Controller
    @RequestMapping("/")
    public class ServisController {

        protected static Logger logger = Logger.getLogger("controller");

        @Autowired
        private ServisRepository servisRepository;
        @Autowired
        private ServisTypeRepository servisTypeRepo;
        @Autowired
        private PartRepository partRepo;
        @Autowired
        private VehicleRepository2 vehicleRepository;   

        /*-- **************************************************************** -*/
    /*--  Editing servis methods                                          -*/
    /*--                                                                  -*/
    /*-- **************************************************************** -*/

        @RequestMapping(value="/admin/servisi/editServis", method = RequestMethod.GET)
        public String getEditServis(@RequestParam(value="id", required=true) Long id, Model model){
            logger.debug("Received request to show edit page");

            List<ServisType> servisTypeList = servisTypeRepo.getAllST();
            List<Part> partList = partRepo.getAllParts();
            List<Part> selectedParts = new ArrayList<Part>();
            Servis s = servisRepository.getById(id);
            for (Part part : partList) {
                for (Part parts : s.getParts()) {
                    if(part.getId()==parts.getId()){
                        selectedParts.add(part);
                        System.out.println(part);
                    }
                }
            }
            s.setParts(selectedParts);

            logger.debug("radjeni dijelovi " + s.getParts().toString());
            logger.debug("radjeni dijelovi " + s.getParts().size());
            s.setVehicle(vehicleRepository.findByVin(s.getVehicle().getVin()));
            model.addAttribute("partsAtribute", partList);
            model.addAttribute("servisTypesAtribute", servisTypeList);
            model.addAttribute("servisAttribute", s);

            return "/admin/servis/editServis";
        }

        @RequestMapping(value="/admin/servisi/editServis", method = RequestMethod.POST)
        public String saveEditServis(@ModelAttribute("servisAttribute") @Valid Servis servis, BindingResult result){
            logger.debug("Received request to save edit page");
            if (result.hasErrors()) 
            {
                String ret = "/admin/servis/editServis";
                return ret;
            }

            servisRepository.update(servis);

            return "redirect:/admin/servisi/listServis?id="+servis.getVehicle().getVin();
        }
}

view displays the service correctly, just it does not preselect parts.

editService:

<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring3-3.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:th="http://www.thymeleaf.org">
<head th:include="fragments/common :: headFragment">
<title>Edit Vehicle Service</title>
</head>
<body>

<div th:include="fragments/common :: adminHeaderFragment"></div>

<div class="container">

<section id="object">
  <div class="page-header">
    <h1>Edit service</h1>
  </div>

<div class="row">

    <form action="#" th:object="${servisAttribute}"
        th:action="@{/admin/servisi/editServis}" method="post" class="form-horizontal well">

        <input type="hidden" th:field="*{vehicle.vin}" class="form-control input-xlarge" />
          <div class="form-group" th:class="${#fields.hasErrors('vehicle.vin')} ? 'form-group has-error' : 'form-group'">
          <label for="vehicle.licensePlate" class="col-lg-2 control-label">License Plate</label>
            <div class="col-lg-10">
                <input type="text" th:field="*{vehicle.licensePlate}" class="form-control input-xlarge" placeholder="License Plate" readonly="readonly"/>
              <p th:if="${#fields.hasErrors('vehicle.licensePlate')}" class="label label-danger" th:errors="*{vehicle.licensePlate}">Incorrect LP</p>
            </div>
          </div>    
          <div class="form-group" th:class="${#fields.hasErrors('serviceDate')} ? 'form-group has-error' : 'form-group'">
          <label for="serviceDate" class="col-lg-2 control-label">Servis Date: </label>
            <div class="col-lg-10">
              <input type="date" th:field="*{serviceDate}" class="form-control input-xlarge" placeholder="Servis Date" />
              <p th:if="${#fields.hasErrors('serviceDate')}" class="label label-danger" th:errors="*{serviceDate}">Incorrect Date</p>
            </div>
          </div>
          <div class="form-group" th:class="${#fields.hasErrors('serviceType.id')} ? 'form-group has-error' : 'form-group'">
          <label for="serviceType.id" class="col-lg-2 control-label">Vrsta Servisa</label>
            <div class="col-lg-10">
                <select th:field="*{serviceType.id}" class="form-control">
                <option th:each="servisType : ${servisTypesAtribute}" 
                        th:value="${servisType.id}" th:selected="${servisType.id==servisAttribute.serviceType.id}"
                        th:text="${servisType.name}">Vrsta Servisa</option>
                </select>
              <p th:if="${#fields.hasErrors('serviceType.id')}" class="label label-danger" th:errors="${serviceType.id}">Incorrect VIN</p>
            </div>
          </div>
          <div class="form-group" th:class="${#fields.hasErrors('parts')} ? 'form-group has-error' : 'form-group'">
          <label for="parts" class="col-lg-2 control-label">Parts</label>
            <div class="col-lg-10">
                <select class="form-control" th:field="*{parts}" multiple="multiple" >
                <option th:each="part : ${partsAtribute}" 
                        th:field="*{parts}"
                        th:value="${part.id}"
                        th:text="${part.Name}">Part name and serial No.</option>
                </select>
              <p th:if="${#fields.hasErrors('parts')}" class="label label-danger" th:errors="*{parts}">Incorrect part ID</p>
            </div>
          </div>
          <div class="form-group" th:class="${#fields.hasErrors('completed')} ? 'form-group has-error' : 'form-group'">
          <label for="completed" class="col-lg-2 control-label">Is service completed?</label>
            <div class="col-lg-10">
              <select th:field="*{completed}" class="form-control">
                <option value="true">Yes</option>
                <option value="false">No</option>
              </select>
              <p th:if="${#fields.hasErrors('completed')}" class="label label-danger" th:errors="*{completed}">Incorrect checkbox</p>
            </div>
          </div>
        <hr/>
          <div class="form-actions">
            <button type="submit" class="btn btn-primary">Edit Service</button>
            <a class="btn btn-default" th:href="@{/admin/servisi/listServis(id=${servisAttribute.vehicle.vin})}">Cancel</a>
          </div>
    </form>

</div>
</section>

<div class="row right">
  <a class="btn btn-primary btn-large" th:href="@{/admin/part/listPart}">Back to list</a>
</div> 

<div th:include="fragments/common :: footerFragment"></div>
</div>
<!-- /.container -->
<div th:include="fragments/common :: jsFragment"></div>

</body>
</html>

UPDATE: With help from Avnish, I made several changes and this is what I came back with:

adding conversion service did not work, so after researching and reading docs, went back and changed my WebMvcConfig file so in stead of @Bean I added this (All I had to do is look at the documentation on WebMvcConfigurationSupport:

@Override
    protected void addFormatters(FormatterRegistry registry){
        registry.addFormatter(new PartTwoWayConverter());
    }

Then I removed my converters and made just one formatter that does the magic. Don't get confused by the name, it is formater:

public class PartTwoWayConverter implements Formatter<Part>{

    /** The string that represents null. */
    private static final String NULL_REPRESENTATION = "null";

    @Resource
    private PartRepository partRepository;

    public PartTwoWayConverter(){
        super();
    }

    public Part parse(final String text, final Locale locale) throws ParseException{
        if (text.equals(NULL_REPRESENTATION)) {
            return null;
        }
        try {
            Long id = Long.parseLong(text);
        // Part part = partRepository.findByID(id); // this does not work with controller
        Part part = new Part(); // this works
        part.setId(id);         // 
        return part;
        }
        catch (NumberFormatException e) {
            throw new RuntimeException("could not convert `" + text + "` to an valid id");
        }       
    }

    public String print(final Part part, final Locale locale){
        if (part.equals(NULL_REPRESENTATION)) {
            return null;
        }
        try {
            return part.getId().toString();
        }
        catch (NumberFormatException e) {
            throw new RuntimeException("could not convert `" + part + "` to an valid id");
        }
    }

}

Then I edited my HTML. Could not make thymeleaf work out, so I did it like this:

<div class="form-group" th:class="${#fields.hasErrors('parts')} ? 'form-group has-error' : 'form-group'">
      <label for="parts" class="col-lg-2 control-label">Parts</label>
        <div class="col-lg-10">
            <select class="form-control" id="parts" name="parts" multiple="multiple" >
            <option th:each="part : ${partsAtribute}" 
                    th:selected="${servisAttribute.parts.contains(part)}"
                    th:value="${part.id}"
                    th:text="${part.name}">Part name and serial No.</option>
            </select>
          <p th:if="${#fields.hasErrors('parts')}" class="label label-danger" th:errors="*{parts}">Incorrect part ID</p>
        </div>
      </div>

And finally, after a lot of trouble and conversion errors that I could not figure out, changed my controller update method:

@RequestMapping(value="/admin/servisi/editServis", method = RequestMethod.POST)
    public String saveEditServis(@ModelAttribute("servisAttribute") @Valid Servis servis, BindingResult result){
        logger.debug("Received request to save edit page");
        if (result.hasErrors()) 
        {
            logger.debug(result);
            String ret = "/admin/servis/editServis";
            return ret;
        }
        List<Part> list = new ArrayList<Part>();
        for (Part part : servis.getParts()) {
            list.add(partRepo.findByID(part.getId()));
        }
        Servis updating = servisRepository.getById(servis.getId());

        updating.setCompleted(servis.getCompleted());
        updating.setParts(list); // If just setting servis.getParts() it does not work
        updating.setServiceDate(servis.getServiceDate());
        updating.setServiceType(servis.getServiceType());

        servisRepository.update(updating);

        return "redirect:/admin/servisi/listServis?id="+servis.getVehicle().getVin();
    }

Even though this works, I am still not happy, since this code looks more like patching than proper coding. Still puzzled why return Part from partRepository did not work. And why thymeleaf did not work... If anyone can send me to the right direction, I would greatly appreciate it!

Answer 1

Thymeleaf compares values (for inclusion of selected="selected" tag in option html) using spring frameworks SelectedValueComparator.isSelected which inherently depends upon java equality first. If that fails, it falls back to String representation of both the values. Following is excerpt from it's documentation

---

Utility class for testing whether a candidate value matches a data bound value. Eagerly attempts to prove a comparison through a number of avenues to deal with issues such as instance inequality, logical (String-representation-based) equality and PropertyEditor-based comparison.
Full support is provided for comparing arrays, Collections and Maps.
Equality Contract
For single-valued objects equality is first tested using standard Java equality. As such, user code should endeavour to implement Object.equals to speed up the comparison process. If Object.equals returns false then an attempt is made at an exhaustive comparison with the aim being to prove equality rather than disprove it.
Next, an attempt is made to compare the String representations of both the candidate and bound values. This may result in true in a number of cases due to the fact both values will be represented as Strings when shown to the user.
Next, if the candidate value is a String, an attempt is made to compare the bound value to result of applying the corresponding PropertyEditor to the candidate. This comparison may be executed twice, once against the direct String instances, and then against the String representations if the first comparison results in false.

---

For your specific case, I'd write down conversion service so that my part object is converted to string as described for VarietyFormatter in http://www.thymeleaf.org/doc/html/Thymeleaf-Spring3.html#configuring-a-conversion-service . Post this I'd use th:value="${part}" and let SelectedValueComparator do it's magic of comparing the objects and add selected="selected" part in the html.

Also in my design, I always implement equals method based on primary key (usually I do it at my top level abstract entity from which all other entities inherit). That further strengths the natural comparison of domain objects in my system throughout. Are you doing something similar in your design?

Hope it helps!!