Joe Essey
Joe Essey

Reputation: 3527

Javascript not loading on internal thymeleaf link

When I open a new form, all the js works, upon edit it fails to load all the internal js. Please work under the assumption that all of the data and routing is hooked up appropriately.

I've got a link to open a form with an existing object:

<a th:if="${foo.typeName} == a" href="Edit"
       th:href="@{/aFoo/{id}(id=${foo.id})}">view</a>

Controller methods:

New Object:

@RequestMapping(value="/aFoo", method=RequestMethod.GET)
    public String newAFooForm(Model model) {
        FooViewModel fooViewModel = new FooViewModel(Type.A);
        model.addAttribute("fooViewModel", fooViewModel);
        return "fooForm";
    }

Load Existing Object:

@RequestMapping(value="/aFoo/{id}", method=RequestMethod.GET)
    public String editAFooForm(@PathVariable("id") Long id, Model model) {
        FooViewModel fooViewModel = assignFooViewModel(id);
        model.addAttribute("fooViewModel", fooViewModel);
        return "fooForm";
    }

The form html/th code shouldn't matter, but to describe my js references:

layout.html is the container for both forms. It has the js imports:

<script th:src="@{js/jquery-1.11.3.min.js}"></script>
<script th:src="@{js/bootstrap.min.js}"></script>
<script th:src="@{js/parsley.min.js}"></script>

and a template for js on contained pages:

<div layout:fragment="script"></div>

fooForm.html has additional js imports, then a ton of js code, it starts:

<div layout:fragment="script">
    <script th:src="@{js/typeahead.bundle.min.js}"></script>
    <script th:src="@{js/handlebars.js}"></script>
    <script>
    ....
    </script>
</div>

My first thought is that I'm somehow writing the link wrong so it loses the context of the referenced js. Any thoughts? Thanks.

Upvotes: 0

Views: 1976

Answers (1)

Joe Essey
Joe Essey

Reputation: 3527

The js imports should have the format:

<script href="/js/handlebars.js" th:src="@{/js/handlebars.js}"></script>

Upvotes: 1

Related Questions