Spring MVC and Thymeleaf Button disabled update

Question

I have two buttons in my form(first and second). Now, I want to update the disable function of my second button when I click the first one.

<form action="updateButton" method="post" id="something">
        <h1 th:text="${application.text}"></h1>
        <button type="submit" name="first">First</button>
        <button type="submit" name="second" th:disabled="${model.disabled}">Second</button>
    </form>

My Controller:

private Boolean disabled = false;

public Boolean getDisabled() {
    return disabled;
}

public void setDisabled(Boolean disabled) {
    this.disabled = disabled;
}

Is there a way to bind the boolean variable with my second button, so that the button enables/disables onclick at the first button? I know I have to write a method with PostMapping("updateButton"). But I don't know how to bind the variable.

Answer 1

This implementation should be done with Javascript and not Thymeleaf.

It has not sense do it with Thymeleaf and reload the page for such thing.

But if you are too much interested in it you could do it adding an action url to the form with something liket this:

<form action="updateButton" method="get" id="something" action="/ws">
        <h1 th:text="${application.text}"></h1>
        <button type="submit" name="first">First</button>
        <button type="submit" name="second" th:disabled="${model.disabled}">Second</button>
</form>

Then you would need a Web service in your controller which handles this situation and redirects to the mapping view putting an attribute to true.

@RequestMapping(value = "/ws")
public ModelAndView disable(@RequestParam("second") String second, Model model) {
    Model model = new Model();        
    model.addAttribute("disableSecondButton", true);

    return "yourview";
} 

Finally add the conditional:

<div th:switch="${disableSecondButton}"> 
  <button type="submit" name="second" th:case="'true'" disabled>Second</button>
  <button type="submit" name="second" th:case="*">Second</button> 
</div>