By using Thymeleaf as template engine, is it possible to add/remove dynamically a CSS class to/from a simple div with the th:if clause?
Normally, I could use the conditional clause as follows:
Lorem Ipsum
We will be creating a link to the lorem ipsum page, but only if condition clause is true.
I'm looking for something different: I'd like the block to always visible, but with changeable classes according to the situation.
There is also th:classappend.
If isAdmin is true, then this will result in:
Yes, it is possible to change a CSS class dynamically according to the situation, but not with th:if. This is done with the elvis operator.
Lorem Ipsum
For this purpose and if i dont have boolean variable i use the following:
<li th:class="${#strings.contains(content.language,'CZ')} ? active : ''">
Another very similar answer is to use "equals" instead of "contains".
<li th:class="${#strings.equals(pageTitle,'How It Works')} ? active : ''">
If you just want to append a class in case of an error you can use th:errorclass="my-error-class" mentionned in the doc.
<input type="text" th:field="*{datePlanted}" class="small" th:errorclass="fieldError" />
Applied to a form field tag (input, select, textarea…), it will read the name of the field to be examined from any existing name or th:field attributes in the same tag, and then append the specified CSS class to the tag if such field has any associated errors
Just to add my own opinion, in case it might be useful to someone.
This is what I used.
<div th:class="${request.read ? 'mdl-color-text--grey-800 w500' : ''}"> </div>
Yet another usage of th:class, same as #NewbLeech and #Charles have posted, but simplified to maximum if there is no "else" case:
<input th:class="${#fields.hasErrors('password')} ? formFieldHasError" />
Does not include class attribute if #fields.hasErrors('password') is false.
What #Nilsi mentioned is perfectly correct. However, adminclass and user class need to be wrapped in single quotes as this might fail due to Thymeleaf looking for adminClass or userclass variables which should be strings. That said,
it should be: -
<a href="" class="baseclass" th:classappend="${isAdmin} ? 'adminclass' :
'userclass'">
</a>
or just:
<a href="" th:class="${isAdmin} ? 'newclass' :
'baseclass'">
</a>
If you are looking to add or remove class accordingly if the url contains certain params or not .This is what you can do
<a th:href="#{/admin/home}" th:class="${#httpServletRequest.requestURI.contains('home')} ? 'nav-link active' : 'nav-link'" >
If the url contains 'home' then active class will be added and vice versa.
Just in case someone is using Bootstrap, I was able to add more than one class:
Related
Seeking help in spring secuity with thyemeleaf. I want to pass specific role as a paramter in spring security hasRole() function.
<li sec:authorize="hasRole(__${someVariable}__)" th:if="${#authentication}">
i just want to pass my role as a variable "somevariable" would have value of like 'admin', 'systemadmin' etc
FYI.. I am using Thymeleaf + Spring
I solved the same basic problem in a way that avoids trying to hack the double-underscore (e.g. __${someVariable}__) syntax.
<th:block th:with="secAuth=${yourNormalModelAccessHere}">
<li class="nav-item" sec:authorize="${#authorization.expression(#vars.secAuth)}">
</th:block>
Hope this helps someone. :)
I can get it solved by using:
${#authorization.expression('hasRole(__${someVariable}__)')}
What do you mean by pass some variable? If you have implemented spring security correctly, hasRole can be evaluated using sec:authorize="hasRole('ROLE_ADMIN') .. etc. Also, you do not need to include th:if since sec:authorize attribute renders its content when the attribute expression is evaluated to true
See reference here
I would ditch sec:authorize and instead write it like this:
<li th:if="${#request.isUserInRole(someVariable)}">
(Assuming somewhat recent version of Servlet API and use of Spring Expression Language in Thymeleaf template.)
In CrafterCMS, in a content type, I have a field type RTE,
If I use the source option and write following code:
<p><span>Test</span></p>
<div class="item_icon"><i class="fa fa-location-arrow"></i></div>
after update it and be back the code is
<p><span>Test</span></p>
(last part was deleted)
Is this the expected behavior? can it be changed by configuration?
The Crafter team is working on an upgrade of TinyMCE in Crafter CMS 3.0, see here: https://github.com/craftercms/craftercms/issues/793
If you need a fix right away, you can try to use " ", or use a tag with: "display:none" for example: <span style="display:none">Something</span>
I need to make a quick change to a page built in Scala in a Play app. Not really sure how to do this...
I have a variable #name that contains "foo" and I want to do this:
<div id="#name" class="#name_class">
and have it resolve to
<div id="foo" class="foo_class">
however Play is trying to look for a variable named #name_class
You can avoid a temporary variable with the following:
<div id="#name" class="#{name}_class"> ...
You can first concatenate the string and the display:
#val class_name = name + "_class"
And then assign:
<div id="#name" class="#class_name">
EDIT
As explained in the comment by #Chirlo the above will not work as of Play 2.1
you can put concatenation in a reusable block and use as such:
#mkClassString(name:String,tag:String):String = { name + tag }
and use it:
<div id="#name" class="#mkClassString(name,"_class")">
or use #defining as indicated by comment.
You can enclose with parenthesis, I haven't really tested with curly braces.
<div id="#name" class="#(name)_class"> ...
I mostly do HTML/CSS/JS so i'm kind'a lost here, so no idea if this is possible the way i want it anyway, this is it:
I have this code
<html:text styleClass="span4" title="No spaces or dashes" />
I want this input to render with the attribute "placeholder". How can i go about this?
Thanks in advance!
If struts doesn't provide then you could inject it using jQuery if you need it
$("#idOfInputText").attr('placeholder', 'some text')
you can supply id using styleId attribute of struts's tag
i mostly do CSS and php so i'm kind'a lost here, so no idea if this is possible the way i want it anyway, this is it:
I have this code
<html:textarea rows="10" cols="70" property="thankYouMessage" />
And i want this textarea to render an id of "textareaID" and a name like "textareaname"
how can i go about this?... if i use styleID, the page just won't load anymore... i need to apply some css to that markup so that's the thing.
Thanks in advance!
styleId attribute should work (perhaps you mispelled it ? case is sensitive)
<html:textarea styleId="textareaID" property="thankYouMessage" ... />
IIRC (long time since Struts 1...) the generated name atribute in the HTML tag will coincide with the property attribute (ref). So in your example the generated HTML (you should check this, looking at the HTML source) should result in something like this:
<textarea id="textareaID" name="thankYouMessage" ...>
Normally you should'nt rely on name for accessing the element (e.g., in Javascript), prefer the id