胸腺多重病

Question

I want to check some condition basing on statement 'myStatus' and if it is true - change background color to red and disable element (user could not click it), if it is false - change color to green. I know how to change color (and it works fine):

th:style="${myObject.myStatus} == true ? 'background-color:red' : 'background-color:green'"

but how is it possile to disable element in this line? I tried something like:

th:style="${myObject.myStatus} == true ? 'background-color:red'  'disabled:false' : 'background-color:green'"

th:style="${myObject.myStatus} == true ? 'background-color:red'  'disabled' : 'background-color:green'"

th:style="${myObject.myStatus} == true ? 'background-color:red' & disable : 'background-color:green'"

but it doesnt work... how is it possible to solve this problem?

@UPDATE

@RequestMapping(value = "/getObject/{someID}", method = RequestMethod.GET)
public String getAttr(@PathVariable(value="someID") String id, Model myObject){
    myObject.addAttribute("myObject", this.objectCreator.getObjects());
    return "/chosenobject";
}

and it works (because colors works fine). I use it in form element.

Answer 1

To disable a HTML element you have to use the HTML attribute disabled : https://www.w3schools.com/tags/att_disabled.asp . You can do this with Thymeleaf as the following:

th:disabled="${myObject.myStatus}" 

is assume myObject.myStatus is either a true of false boolean value

To set the color conditionally do the following:

th:style="${myObject.myStatus} ? 'background-color:red' : 'background-color:green'"

Answer 2

You can use Javascript to disable an element if a condition sent from the controller evaluates to true (or false).

document.getElementById("id").disabled = true;

You can also mock the disabled attribute in CSS with pointer-events:none like this:

th:style="${myObject.myStatus} == true ? 'background-color:red;' : 'background-color:green; pointer-events: none;'"