Search code examples
javamysqlamazon-web-servicesspring-bootthymeleaf

Spring Boot and Thymeleaf: Switching Pages through Nav bar links


I am working on a Car Dealership project utilizing:

Java 8

Spring boot

Thymeleaf

AWS mySQL database

my current problem is that i an having trouble using my nav bar to move between html pages. i have 5 html pages( index.html, customer.html, employee.html, vehicle.html, and transaction.html)

code from index.html:

    <a class="active" th:href="@{/index.html}"><i class="(Put css class here)"></i> Home</a>
    <a th:href="@{/vehicle.html}"><i class="(Put css class here)"></i> Vehicles </a>
    <a th:href="@{/customer.html}"><i class="(Put css class here)"></i> Customers </a>
    <a th:href="@{/employee.html}"><i class="(Put css class here)"></i> Employees </a>
    <a th:href="@{/transaction.html}"><i class="(Put css class here)"></i> Transactions </a>

code from IndexController:

@Controller
public class IndexController {

@RequestMapping("/index")
public String index(){
    return "index";
}

}

the page loads normally at localhost:8088 when first opened, but when i click "home" or any other button i get a 404.

if anyone could simply point me in a general direction i would greatly appreciate it.


Solution

  • Instead, try to make GetMapping requests in the controller for those different links.

    Example:

        @GetMapping("/customer")
      public String getCustomer(){
        return "customer.html";
     }
    

    And in your html class (nav bar):

        <a th:href="@{/customer}"><i class="(Put css class here)"></i> Customers </a>
    

    *Make sure to remove the .html, but this depends on how you've configured it in your config, but I believe this is the default configuration.