Send list object from thymeleaf to controller

Question

I have a big problem about saving an Object list from Thymeleaf to the controller. Object List in thymeleaf is generated by Jquery. but I don't know how to get the data to Controller, that Object list doesn't know the size. Because users can add it anytime. Please help me to send a list object in thymeleaf to controller.

I’ve Created a new class with 1 properties: ArrayList loaiDoans; "LoaiDoan" is a Object that i want to save. And using that class is an object to Save List "LoaiDoan" from thymeleaf to controller. But List don't know the size first.because that genarated in thymeleaf. The first time i load the Model, the Model contain List is empty,so that list is not display in screen.

This is my class

public class ListLoaiDoan {
    private ArrayList<LoaiDoan> loaiDoans;
//Getter Setter
}

My controller bind list object from controller to thymeleaf

@RequestMapping("/luunhieuobject")
public String LoadNhieuObjectCungLuc(Model model) {
    ListLoaiDoan listLoaiDoanAAA = new ListLoaiDoan();
    model.addAttribute("listLoaiDoan111",listLoaiDoanAAA);
            return "/MHtrangchu/LuuNhieuObjCungLuc";
        }
//This is the method save list Object from thymeleaf to controller
@PostMapping("/luunhieuobject")
public String processQuery(@ModelAttribute("listLoaiDoan111") ListLoaiDoan listLoaiDoan) {
System.out.println(listLoaiDoan.getLoaiDoans() != null ? listLoaiDoan.getLoaiDoans().size() : "List Empty");
              System.out.println("--");
              return "/MHtrangchu/LuuNhieuObjCungLuc";
   }

LuuNhieuObjCungLuc.html

<form th:object="${listLoaiDoan111}" method="post" th:action="@{/luunhieuobject}">

<!--INPUT FIELDS-->
        <div class="row">
            <div class="col">
                <div id="movieList">
                    <div class="row">
                        <div style="margin-left:100px;" class="col-4 form-group">tenloaidoan</div>
                        <div style="margin-left:100px;" class="col-4 form-group">madoan</div>
                    </div>
                    <div class="row item" th:each="row, stat : ${listLoaiDoan111.loaiDoans}">

                        <div class="col-lg-6 form-group">
                            <input th:field="*{loaiDoans[__${stat.index}__].tenloaidoan}" type="text" class="form-control"/>
                        </div>
                        <div class="col-lg-6 form-group">
                            <input th:field="*{loaiDoans[__${stat.index}__].madoan}" type="text" class="form-control"/>
                        </div>
                    </div>
                </div>
            </div>
        </div>
<!--ADD NEW ROW BUTTON-->
        <div class="row">
            <div class="col">
                <button type="button" class="btn btn-success" onclick="addRow()">Add row</button>
            </div>
        </div>
        <!--SUBMIT FORM BUTTON-->
        <div class="row text-right">
            <div class="col">
                <button type="submit" class="btn btn-primary">Submit</button>
            </div>
        </div>
     </form>

That not display annything in the screen, i know that because "listLoaiDoanAAA" is the empty and "th:each" in thymeleaf have nothing to show, how to generate "input" tag and save to controller help me !

Answer 1

I solved this problem ! Set a size for ArrayList before bind it to thymeleaf ! I save my day. thanks Stackoverflow.

i fix my controller like this

@GetMapping("/luunhieuobject")
        public String LoadNhieuObjectCungLuc(Model model) {
            ListLoaiDoan listLoaiDoanAAA = new ListLoaiDoan();
            ArrayList<LoaiDoan> LDD = new ArrayList<LoaiDoan>(10);
            listLoaiDoanAAA.setLoaiDoans(LDD);
            model.addAttribute("listLoaiDoan111", listLoaiDoanAAA);
            return "/MHtrangchu/LuuNhieuObjCungLuc";
        }