Neither BindingResult nor plain target object for bean name 'phonebook' available as request attribute

Question

I trying to add validation to phone number input but i stuck at resolving this error when accessing index.

The error message

Caused by: org.attoparser.ParseException: Error during execution of processor 'org.thymeleaf.spring5.processor.SpringInputGeneralFieldTagProcessor' (template: "index" - line 76, col 73)

Caused by: java.lang.IllegalStateException: Neither BindingResult nor plain target object for bean name 'phonenumber' available as request attribute

index.html

 <div class="myForm">
            <form th:action="@{/save}"  method="post" th:object="${phonebook}">
            <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="exampleModalLabel">Update or Create</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <div class="form-group">
                                <input type="hidden" class="form-control" id="id" name="id" value=""/>
                            </div>
                            <div class="form-group">
                                <label for="surname" class="col-form-label">Surname:</label>
                                <input type="text" class="form-control" id="surname" name="surname" value=""/>
                            </div>
                            <div class="form-group">
                                <label for="firstname" class="col-form-label">First Name:</label>
                                <input type="text" class="form-control" id="firstname" name="firstname" value=""/>
                            </div>
                            <div class="form-group">
                                <label for="phonenumber" class="col-form-label">Phone Number:</label>
                                <input type="text" class="form-control" th:field="*{phonenumber}" id="phonenumber" name="phonenumber" value=""/>
                                <span th:if="${#fields.hasErrors('phonenumber')}" class="help-block" th:errors="*{phonenumber}"></span>
                            </div>

                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                            <input type="submit" class="btn btn-primary" value="Save"/>
                        </div>
                    </div>
                </div>
            </div>
        </form>

Controller

@RequestMapping(value = {"/"}, method = RequestMethod.GET)
public String showPage(Model model, @RequestParam(defaultValue = "0") int page) {
    model.addAttribute("data", phonebookRepository.findAll(PageRequest.of(page, 10)));
    model.addAttribute("currentPage", page);
    return "index";
}

@PostMapping("/save")
public String save(@Valid Phonebook p, BindingResult bindingResult) {

    if (bindingResult.hasErrors()) {
        return "redirect:/";
    }else {
        phonebookRepository.save(p);
    }
    return "redirect:/";
}

Phonebook

     @Entity
        @Table(name = "Phonebook")
        public class Phonebook {

            @Id
            @GeneratedValue(strategy = GenerationType.AUTO)
            @Column(name = "id")
            private Integer id;
            @NotNull
            @Size(max=15, message = "Max symbols is 15")
            @Column(name = "phonenumber", length = 15, nullable = false)
            private String phonenumber;
            @Column(name = "surname", length = 50, nullable = false)
            private String surname;
            @Column(name = "firstname", length = 50, nullable = false)
            private String firstname;

//getters and setter

Answer 1

I've got 2 approach to get this issue solve :--

1.) use @RequestParam to get the Phonebook Object like this :--

@PostMapping("/save")
public String save(@Valid @RequestParam("phonenumber")String phonenumber, BindingResult bindingResult) {

    if (bindingResult.hasErrors()) {
        return "redirect:/";
    }else {
        phonebookRepository.save(p);
    }
    return "redirect:/";
}

OR -- Use @ModelAttribute to get the values of your form, like this :--

1.) create a new Phonebook object and add in model attribute :-

     @RequestMapping(value = {"/"}, method = RequestMethod.GET)
        public String showPage(Model model, @RequestParam(defaultValue = "0") int page) {

            //your code 

            model.addAttribute("phoneBook", new Phonebook());
            return "index";
        }

2.) Changes in your Thymeleaf / HTML page (use th:object to send your Phonebook object after submit) :--

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

// your code

</form>

3.) Then Use @ModelAttribute to bind the values like this :--

@PostMapping("/save")
public String save(@Valid @ModelAttribute("phoneBook")Phonebook p, BindingResult bindingResult) {

    if (bindingResult.hasErrors()) {
        return "redirect:/";
    }else {
        phonebookRepository.save(p);
    }
    return "redirect:/";
}

4.) And finally your Phonebook class with getter & setter Methods.