thymeleaf template not working, where did I go wrong?

P

P_Alexander2018-06-18 15:17:51

Java

P_Alexander, 2018-06-18 15:17:51

Good afternoon, I'm trying to build a page using the thymeleaf template and something doesn't work, tell me where the error is.
Template location - webapp/resources/thymeleaf/base-layout.html Footer
, header, navigation location - webapp/resources/thymeleaf/
Main page location - WEB-INF/view/main.html
I added a navbar to the navigation file and as it should you can see it on the main page, but it's not there.
The template itself

<!DOCTYPE html>
<html xmlns = "http://www.w3.org/1999/xhtml"
      xmlns:th = "http://www.thymeleaf.org"
      xmlns:layout = "http://www.ultraq.net.nz/thymeleaf/layout">

<head th:replace="thymleaf/header :: header">
    <meta charset="UTF-8">
    <title>Title</title>
</head>
    <body>
    <div th:replace="thymeleaf/navigation :: navigation"></div>
        <div layout:fragment="content"></div>
        <div th:replace="thymeleaf/footer :: footer"></div>
    </body>
</html>

navigation:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>

    <title>Title</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light" th:fragment="navigation">
    <a class="navbar-brand" href="#">Navbar</a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>

    <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
        <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
            <li class="nav-item active">
                <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Link</a>
            </li>
            <li class="nav-item">
                <a class="nav-link disabled" href="#">Disabled</a>
            </li>
        </ul>
        <form class="form-inline my-2 my-lg-0">
            <input class="form-control mr-sm-2" type="search" placeholder="Search">
            <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
        </form>
    </div>
</nav>
</body>
</html>

main page

<!DOCTYPE html>
<html xmlns:th = "http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorator="webapp/resources/thymeleaf/base-layout.html">
<head>
    <title>MAin</title>
</head>
    <body>
        <div layout:fragment="content">
            <h1>IT is main</h1>
            <h2 th:text="${message}"></h2>
        </div>
    </body>
</html>

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

P

piatachki, 2018-06-21
@P_Alexander

Actually, in the main markup, there is no call to the navigantion fragment. You are calling an empty content fragment from the first template ( by the ~~way, an incomprehensible namespace: layout:fragment="content", I did not find it in the official documentation, I~~ saw a link in the title). He, I hope, is successfully substituted. But the navigation call from the second template in the first template does not fall into the main one, since it is outside the scope of the context of the called content fragment