Global Superstore

Task 1

Create a Controller class and assign it a name of your choice.

Task 2

Map a GET request on path / to a handler method called getForm().

    @GetMapping("/")
    public String getForm()

• The handler method must return the form view.

    @GetMapping("/")
    public String getForm() {
        return "form";
    }

Task 3

Before returning the "form" view, add Constants.CATEGORIES as a model attribute.

    @GetMapping("/")
    public String getForm(Model model) {
        model.addAttribute("categories", Constants.CATEGORIES);
        return "form";
    }

Inside the form template, use a Thymeleaf Loop to populate the drop-down list with values from the array.

Task 4

In a drop-down list, every <option> needs to equal a value.

The value attribute determines what will be sent upon form submission

Example

---

If the user chooses the option "Capital of Canada", Ottawa will be sent upon form submission.

<select>
  <option value="Ottawa">Capital of Canada</option>
  <option value="Paris">Capital of France</option>
</select>

---

In your case, the option that displays Choose Category must equal a blank value.

<option style="color:blue" value="">Choose Category</option>

Every <option> that follows must equal a value that matches the text it displays.

<option |Thymeleaf Loop| th:text= |Element in LOOP| th:value = |Element in LOOP|>   </option>

Task 5

Map any GET request made on the path /inventory to a handler method called getInventory.

    @GetMapping("/inventory")
    public String getInventory()

The handler method must return the inventory view.

    @GetMapping("/inventory")
    public String getInventory() {
        return "inventory";
    }

Task 6

Inside both templates, ensure that:

• The Form button makes a GET request on path /.
• The Inventory button makes a GET request on path /inventory.

Run your application and toggle between the buttons.

Good Luck!