How to format date and time in thymeleaf input form?

Question

While inserting values into the spring hibernate java models it is throwing this error

The Error

Field error in object 'flightPlanning' on field 'arrivalTime': rejected value [15:45]; codes [typeMismatch.flightPlanning.arrivalTime,typeMismatch.arrivalTime,typeMismatch.java.sql.Time,typeMismatch]; arguments [org.springframework.context.support.DefaultMessageSourceResolvable: codes [flightPlanning.arrivalTime,arrivalTime]; arguments []; default message [arrivalTime]]; default message [Failed to convert property value of type 'java.lang.String' to required type 'java.sql.Time' for property 'arrivalTime'; nested exception is org.springframework.core.convert.ConversionFailedException: Failed to convert from type [java.lang.String] to type [@javax.persistence.Column java.sql.Time] for value '15:45'; nested exception is java.lang.IllegalArgumentException] Field error in object 'flightPlanning' on field 'depTime': rejected value [04:56]; codes [typeMismatch.flightPlanning.depTime,typeMismatch.depTime,typeMismatch.java.sql.Time,typeMismatch]; arguments [org.springframework.context.support.DefaultMessageSourceResolvable: codes [flightPlanning.depTime,depTime]; arguments []; default message [depTime]]; default message [Failed to convert property value of type 'java.lang.String' to required type 'java.sql.Time' for property 'depTime'; nested exception is org.springframework.core.convert.ConversionFailedException: Failed to convert from type

Here the form in thymeleaf

<form action="#" th:action="@{/flight-plan-create}"
            th:object="${flightplanning}" method="POST">
            <table
                class="table table-bordered table-striped table-hover table-condensed table-center  text-center "
                id="DyanmicTable">
                <thead>
                    <tr>
                        <th class="text-center">Departure Date</th>
                        <th class="text-center">Source</th>
                        <th class="text-center">Destination</th>
                        <th class="text-center">Departure Time</th>
                        <th class="text-center">Arrival Time</th>
                        <th class="text-center">Offset</th>
                        <th class="text-center">Seat Capacity</th>
                        <th class="text-center">Fare (₹)</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td><input type="date" th:field="*{departureDate}"
                            class="form-control"></td>
                        <td><input type="text" th:field="*{departureAirport}"
                            class="form-control"></td>
                        <td><input type="text" th:field="*{arrivalAirport}"
                            class="form-control"></td>
                        <td><input type="time" th:field="*{depTime}"
                            class="form-control"></td>
                        <td><input type="time" th:field="*{arrivalTime}"
                            class="form-control"></td>
                        <td><input type="number" th:field="*{offset}"
                            class="form-control"></td>
                        <td><input type="number" th:field="*{seatCapacity}"
                            class="form-control"></td>
                        <td><input type="number" th:field="*{fare}"
                            class="form-control"></td>
                    </tr>
                </tbody>
            </table>
            <button type="submit" class="center-button btn-primary">Confirm</button>

        </form>

How to format the *{depTime} and *{arrivalTime} in such a way that the java.sql.Time variables accept these values. I am new to spring, whether this is to be done in thymeleaf itself or in java controller. Is there any way it can be done using spring controller or thymeleaf or JS.

Java model

FlightPlanning.java

package com.me.springboot.model;

import java.sql.Date;
import java.sql.Time;

import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.Table;

@Entity
@Table(name = "flightplanning")
public class FlightPlanning {
    @Id
    @GeneratedValue( strategy = GenerationType.IDENTITY)
    private long flightId;
    
    @Column(name = "dep_time")
    private Time depTime;
    
    @Column(name = "arrival_time")
    private Time arrivalTime;
    
    @Column(name = "offset")
    private int offset;
    
    @Column(name = "departure_airport")
    private String departureAirport;
    
    @Column(name = "arrival_airport")
    private String arrivalAirport;
    
    @Column(name = "departure_Date")
    private Date departureDate;

    @Column(name = "seat_capacity")
    private int seatCapacity;
    
    @Column(name = "fare")
    private String fare;

    public long getFlightId() {
        return flightId;
    }

    public void setFlightId(long flightId) {
        this.flightId = flightId;
    }

    public Time getDepTime() {
        return depTime;
    }

    public void setDepTime(Time depTime) {
        this.depTime = depTime;
    }

    public Time getArrivalTime() {
        return arrivalTime;
    }

    public void setArrivalTime(Time arrivalTime) {
        this.arrivalTime = arrivalTime;
    }

    public int getOffset() {
        return offset;
    }

    public void setOffset(int offset) {
        this.offset = offset;
    }

    public String getDepartureAirport() {
        return departureAirport;
    }

    public void setDepartureAirport(String departureAirport) {
        this.departureAirport = departureAirport;
    }

    public String getArrivalAirport() {
        return arrivalAirport;
    }

    public void setArrivalAirport(String arrivalAirport) {
        this.arrivalAirport = arrivalAirport;
    }

    public int getSeatCapacity() {
        return seatCapacity;
    }

    public void setSeatCapacity(int seatCapacity) {
        this.seatCapacity = seatCapacity;
    }

    public String getFare() {
        return fare;
    }

    public void setFare(String fare) {
        this.fare = fare;
    }
    
    public Date getDepartureDate() {
        return departureDate;
    }

    public void setDepartureDate(Date departureDate) {
        this.departureDate = departureDate;
    }
    
    
}

FlightPlanningController.java

@GetMapping("/flight-plan/controller")
public String showNewFlightPlanningForm(Model model) {
    FlightPlanning flightplanning = new  FlightPlanning();
    model.addAttribute("flightplanning", flightplanning);
    return "admin/newSchedule";
}

@PostMapping("/flight-plan-create")
public String saveFlightPlanning(@ModelAttribute("flightPlanning") FlightPlanning flightPlanning ) {
    flightPlanningService.saveFlightPlanning(flightPlanning);
    return "redirect:/admin/shedule";
}

Answer 1

Annotate the time and date parameters as shown below, I had experienced the same problem earlier

@Column(name = "dep_time")
@DateTimeFormat(iso = DateTimeFormat.ISO.TIME)
private java.time.LocalTime dep_time;
@Column(name = "arrival_time")
@DateTimeFormat(iso = DateTimeFormat.ISO.TIME)
private java.time.LocalTime arrivalTime;
@Column(name = "departure_Date")
@DateTimeFormat(pattern = "yyyy-MM-dd")
private java.time.LocalDate departureDate;

Answer 2

The problem is from trying to store Time in SQL. It looks like your JPA implementation doesn't like sql.Time (I'm not sure any JPA implementations handle it at all anyway) Try LocalDateTime and it should persist properly.

Edit: looks like sql.Time is fine as well (my apologies)

This seems to be more complicated than I thought. It looks like you are trying to input String data from a form and send it to your @PostMapping. This is why it's complaining about String to LocalDateTime conversion. (it wont auto convert like simpler Object types). You need to find a way to parse the String data into a LocalDateTime.

A Simpler workaround may be to have a pre-existing collection of FlightPlanning that you can instead select with the form.