How can disable th:href link for a defined th:value-CodePudding

I'm a new in Java Spring Development. There is a Thymeleaf code for generating active "href-links":

<td> <a id="requeststatus"
        th:each="requeststatus : ${requeststatuses}" 
        th:if="(${requeststatus.id} == ${request.request_status_id})" 
          th:href="@{'/system/request/edit/requeststatusid/'   ${request.id}}" 
             th:text="${requeststatus.title}" th:value="${requeststatus.id}"
        th:unless="${requeststatus.id} >= 4" >                              
     </a>
 </td>

For th:unless="${requeststatus.id} >= 4" i get empty ${requeststatus.title}, but i need get just not clickable requeststatus.title instead href for ${requeststatus.id} >= 4.

For example, how do I make a link inactive for ${requeststatus.id} >= 4 ?

CodePudding user response：

As stated in comments by @andrewJames conditionally disabling the link is not good practice. using th:switch you can replace the a with, for example a span with the same text. In general if you want different behaviour depending on a variable it's best to wrap said behaviour in a th:block with an appropriate if or switch case condition

<td> 
    <th:block th:each="requeststatus : ${requeststatuses}">
        <th:block th:switch="true">
            <a th:case="${requeststatus.id} < 4"
                id="requeststatus"
                th:href="@{'/system/request/edit/requeststatusid/'   ${request.id}}" 
                th:text="${requeststatus.title}" th:value="${requeststatus.id}" >                             
            </a>
            <span th:case="*" th:text="${requeststatus.title}"></span>
        </th:block>
    </th:block> 
 </td>

PS: in html the id should be unique, as such using a static id in a for loop should not be done, you could for example add the iter part to for loop and make ids like requeststatus1 ,..2, etc.

CodePudding user response：

With the help of CSS you can disable the hyperlink. Try the below

a.disabled {
  pointer-events: none;
  cursor: default;
}
<a href="link.html" >Link</a>

Or with the JS

<a href="javascript:function() { return false; }">link</a>
<a href="/" onclick="return false;">link</a>

/* You can also try void(0)

<a href="javascript:void(0)" style="cursor: default;">123n</a>

Hope this helps :)