I am trying to configure spring boot thymeleaf and intellij, and for the most part have nailed it, but I cant seem to be able to link controllers with their views, as intellij annoyingly keeps displaying the following message, and the auto-completing the system is not working:
Cannot Resolve 'varName'
my controller looks like this "main/java/..../controller.java"
#Controller
public class CardsController {
#RequestMapping(value="/card/{id}",method = RequestMethod.GET)
public String viewCardAction(#PathVariable("id") Card card,Model model){
model.addAttribute("card",card);
return "cards/view";
}
}
And this is my mockup view "main/resources/cards/view/cards/view":
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">
<meta charset="UTF-8"/>
<title th:text="${card.name}"></title> <!-- this line shows the message -->
</head>
<body>
<div th:text="${card.name}"></div> <!-- this line shows the message -->
</body>
</html>
is it that intelij, is still not working for this, or am I missing some configuration
NOTE: it works and compiles, just wanna enable autocomplete
Looks like this is a bug in Intellij.
Here's the youtrack link:
https://youtrack.jetbrains.com/issue/IDEA-132738
It hasn't gotten much attention from the JetBrains developers yet so you may want to add your comments or vote it up there.
Since it is still unresolved and people might come here by search, here is the workaround mentioned by zhao xinjing in the link posted in the accepted answer:
<!--/*--><!--#thymesVar id="loginFormBean" type="sample.system.login.LoginFormBean"--><!--*/-->
<form id="formMain" class="form-horizontal" action="#" data-th-action="#{/login}" data-th-object="${loginFormBean}" method="post"> as thymeleaf comment, nothing be left in html output
You can also use it to specify collections, e.g.
<!--/*--><!--#thymesVar id="names" type="List<String>"--><!--*/-->
<!--/*--><!--#thymesVar id="name" type="String"--><!--*/-->
<li th:each="name: ${names}" ... />
Related
I have a simple html page, "index.html". I'm testing server.servlet.context-path=/test and i'm testing on the webpage the redirection on itself, nothing more. For some reason that I can't understand, even with the docs about thymeleaf https://www.thymeleaf.org/doc/articles/standardurlsyntax.html
<a th:href="#{/index.html}">Reload page</a>
It's just displaying "Reload page" and I can't even click on it. My goal is to be able to click on it and to be redirected to /test/index.html, as I thought this would be the accurate method.
Feel free to give me any advice on how to do so, or why isn't it working the way it's supposed to be.
Thanks you very much for your time !
EDIT : Here are the dependencies thymeleaf-related I'm using :
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head>
<title>Test page</title>
</head>
<body>
<a th:href=#{/index.html}>Reload page</a>
</body>
</html>
This is the exact page I'm using. If I remove the xmlns in the html tag, the th:ref is marked as "Undefined attribute name (th:href)." Which made me think that when I have the xmlns (as it is right now) the attribute is correctly defined.
I consider moving from Thymeleaf templating to EJS templating in my Spring Boot application (there is a need to execute some javascript code on server side). I've successfully configured everything and created my first view using few online examples:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Hello</title>
</head>
<body>
Hello <%= username %>
</body>
</html>
This works OK when I pass String variable named "username" from controller to view. However, I would like my view to use messages from static file "/resources/i18n/messages.properties". In thymeleaf it is widely used, simple and possible by:
th:text="#{messages.hellomessage}"
How to achieve the same result using EJS?
You'll have to create a new ScriptTemplateViewResolver and also create a new ScriptTemplateConfigurer leveraging the Nashorn support as engine.
Take a look at this tutorial for an example.
I wrote (copied) a first program in WebMatrix. I selected EmptySite template and in Page.cshtml I typed 2 lines. Finaly, the code in Page.cshtml looks like this:
#{
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<h1>Welcome to the WebMatrix!</h1>
<p>I began to become a web developer on #DateTime.Now.ToString()</p>
</body>
</html>
I pressed "Run" but I got an empty web-page. Nothing is written on it. I received no error message.
Well, what's wrong ?
Thanx,
Eb_Cj
You seem to be going to the default document rather than your page. You can solve this in two ways: either right click on the Page.cshtml node in the project explorer within WebMatrix and select Launch in browser or manually change the URL in your browser to localhost:25776/Page.
I have an Umbraco 5 MVC3 project where i discovered that there where white spaces here and there. When investigating i discovered that my HTML looked really bad when "viewing generated source" in firefox web developer tool. For example it removes my doctype declaration and moves my meta-tags and stuff out of the head. Simplified code:
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>#ViewBag.Title</title>
<link rel="stylesheet" href="#Url.Content("~/Content/Styles/style.css")"/>
</head>
<body id="" class="default">
<div id="wrapper">
<header id="banner" class="body">
<a class="ir logo" href="/"><h1>Christian </h1></a>
<ul class="share">
<li id="facebook"><a class="ir" href="http://www.facebook.com/sharer.php?u=#Request.Url.AbsoluteUri">Facebook</a></li>
<li id="twitter"><a class="ir" href="http://twitter.com/share?text=Christian">Twitter</a></li>
</ul>
#Html.Partial("nav")
</header>
<section id="content" class="body">
#RenderBody()
</section>
</div>
<script src="#Url.Content("~/Scripts/plugins.js")"></script>
<script src="#Url.Content("~/Scripts/script.js")"></script>
</body>
</html>
And the output begins like this
<html class="no-js" lang="en"><head></head><body id="" class="default">
If you want to check on the HTML generated by your server, you should use View source (CTRL + U).
Generated source is more like a reconstruction of the HTML based on the DOM and includes for example nodes created on the client side with javascript, once the page is loaded.
Alright, i solved it. Took me a while. After Marapet suggested not to use "generated source" i tried normal "view source" in a bunch of browsers and got different results in all of them. When i tried to validate my source i got some weird complaints:
Non-space characters found without seeing a doctype first. Expected <!DOCTYPE html>.
Element head is missing a required instance of child element title.
And my personal favourite
Cannot recover after last error. Any further errors will be ignored.
Looked like there was something up with the doctype. Opened up notepad and pasted in there to "wash" the code from metadata, the way i do sometimes when pasting stuff in to tinyMCE. The text got formatted weird even in notepad. The doctype declaration had a smaller font size then the rest of the html.
So i opened it in notepad++ too and there i got a bunch of questionmarks in front of the declaration. I removed them and copied it back in to Visual Studio, saved and now everything works.
I think the reason i got this problem was that i copied snippets directly from the HTML5 Boilerplate on github.
// Sherlock
I have a very strange problem in my web application.
I am using icefaces with jsf and on some of my pages (please do not ask for the code because it's a lot of it:) I see the hourglass effect appearing on firefox.
I can clearly confirm that is because, somehow, the jsf cycle is not entirely finished. (all the components are visible but validation is not working).
Please note that this issue does not appear if I press F5 but only when I switch some tabs, which basically change the content of the main form)...
Are you guys having any suggestion? Google did not help me...nor Firebug...
UPDATE:
- after further investigation with Firebug it seems that when I do an ajax POST, it does not load the scripts and css which are inside the <body> </body> (you will see in the answer why it puts some css and scripts here) tag...but only the ones from <head>...</head>
Issue solved!!! (please see my update before continuing reading this answer)
I had this code in my main template:
<head>
<ui:include
src="/WEB-INF/jsf/common/templates/main/commonResources-include.xhtml" />
</head>
Now please note that commonResources-include.xhtml has this code (please note html tags!)
<html
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
..code..
</html>
It seems that whenever you use these facelets components to be included, templating etc you MUST use <ui:composition> tags and not <html>, because html tags will confuse the rendering engine of the browser! What is strange is that a lot of examples from the internet use html tags for these facelets which do not give issues in helloWorld examples but can be a pain in complex applications!
So, the final code:
<ui:composition
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
..code..
</ui:composition>