Order by in Thymeleaf - html

I need show this foreach by order Asc, how can I do it?
<tr th:each="ment : ${mentor}" th:if="${ment.jobId == job.id}">
<td th:text="${ment.id}"></td>
<td th:text="${ment.name}"></td>
<td th:text="${ment.qtyMentee}"></td>
<td th:text="${ment.jobId}"></td>
</tr>

This could be achieved with sort utility methods for lists, described here.
/*
* Sort a copy of the given list. The members of the list must implement
* comparable or you must define a comparator.
*/
${#lists.sort(list)}
${#lists.sort(list, comparator)}
Example
<tr th:each="ment : ${#lists.sort(mentor)}">

I had StackOverflow also, in my case I forgot to implement Comparable:
Comparable<E>
The error was missleading, thymeleaf could recognize that compareable needs to be implemented.

Related

How to find a specific element and get a field value from a list of objects in thymeleaf

I have this block in thymeleaf where I'm trying to show the name of a protocolVersion isntead of the id. I only have the Id so I pass the list of protocolVersion (protocolVersions) and I'm iterating over it to show the one that matches the id (1007 is just a test).
<th:block th:each="item: ${protocolVersions}">
<tr th:if="${item.id == 1007}">
<td th:text="${item.name}"></td>
</tr>
</th:block>
I'm getting the error message:
Exception evaluating SpringEL expression: "item.id == 1007"
I've also tried something like this, as I've found it in one of the questions here:
<td th:if="${protocolVersions.?[id == '${excelMongoDoc.protocolVersionId}']}"
th:text="${protocolVersions[id == '${excelMongoDoc.protocolVersionId}'].name}">
</td>
But this is not working either. Can anyone help please?
Thanks
The expression is simply: ${protocolVersions.^[id==1007].name}. So you could do this in your table:
<tr>
<td th:text="${protocolVersions.^[id==1007].name}"></td>
</tr>
If you want to check against a variable, rather than hardcoding 1007 something like this:
<th:block th:with="check=1007">
<td th:text="${protocolVersions.^[id==#root.check].name}"></td>
</th:block>

How to edit grails column?

I need some conceptual answers.
In my grail application, I need to edit a column from a list view. The problem is that the column item(for instance an author)is linked to another domain(employee)class. So in order to edit the 'author' I have to edit 'employee' (just to clarify all author are from employee class) in the table. Not sure how I can search/get an employee from the list of employee in the column to replace an author.
I know in general I can edit any page, but this look somewhat different.
I am relatively new to groovy-grails.
You can use HTML table to retrieve list as below code
<table>
<thead>
<tr>
<g:sortableColumn property="id" title="ID" />
<g:sortableColumn property="author" title="Author" params="${filterParams}"/>
</tr>
</thead>
<tbody>
<g:each in="${EmployeeList}" status="i" var="employee">
<tr class="${(i % 2) == 0 ? 'even' : 'odd'}">
<td><g:link action="show" controller="employee" id="${employee.id}">${fieldValue(bean: employee, field: "id")}</g:link></td>
<td>${fieldValue(bean: employee, field: "author")}</td>
</tr>
</g:each>
</tbody>
</table>
And for searching you may use DataTables

How to add the background-color for data in table using bootstrap-classes and angularjs?

I want to do a small E-commerce application. After done the order by the user, admin got orders and order item consist of order id, itemname, price, status, btnclass.
Default status of the order is pending and value of btnclass is label-warning, After editing the order pending to delivered the value of the btnclass change to the label-success. but i don't know how to do this
btnclass is for storing the bootstrap class.
<table>
<th>order id</th>
<th>item name</th>
<th>price</th>
<th>status</th>
<th>total</th>
<tr ng-repeat="item in orders">
<td>{{item.orderid}}</td>
<td>{{item.itemname}}</td>
<td>{{item.price}}</td>
<td><p class="label {{list.btnclass}}">{{item.status}}</p></td>
<td>{{item.total}}</td>
</tr>
</table>
My array is like this:
[
{
"orderid":1,
"itemname":"rice",
"price":10,
"status":"pending",
"btnclass":"label-warning",
"total":10
},
{
"orderid":2,
"itemname":oils,
"price":50,
"status":"deliverd",
"btnclass":"label-success",
"total":50
}
Please help me how to provide classes for the table data..
ng-class is useful for that. You can create 2 CSS classes for the status, for example .delivered or .pending. And use ng-class directive as such :
<td><p ng-class="{'deliverd' : item.status === 'delivered', 'pending' === 'item.status === 'pending'}">{{item.status}}</p></td>
It's actually very easy, you have to use ng-class.
With ng-class you can pass a group of classes and conditions that determine if the classes should be applied or not, the syntaxis is this
<any ng-class="{'my-class':condition===true, 'my-second-class': someFunction()}" />
notice that the parameter passed to ng-class is a js object, where the keys are the name of the classes to apply, and the values are the conditions, if a condition resolves to true then the class used as key will be applied, otherwise it will be ignored. As you can see you can either use expressions like in the first case (condition===true) or you can call functions like I did in the second example (someFunction()) try to use this to solve your problem, and, if you can't feel free to ask for further assistance.

Thymeleaf, get first element list of an object that is already iterating

<tr th:each="current : ${object.list}" >
<td th:text="${current.currentList...???}"></td>
...
I have an object that has a list.
"current" has also a list inside it called currentList.
currentList has only one element called objectTwo. I want to access to the attributes of objectTwo.
It's possible?
Hope this will work for you.
<tr th:each="current : ${object.list}" >
<td th:text="${current.currentList[0].objectTwo...}"></td>
...

Regex - Match multiline blocks of HTML code

I have a problem with my regular expression. I need to match blocks of HTML.
Example-Block here:
<tr class="tr-list " data-id="XX">
<td class="ip-img"><div class="gun-icon"></div><img src="https://example.com/images/stories/HCP/HCP_5.jpg"/></td>
<td class="ip-name ip-sort">Hotel Complex Project</td>
<td class="ip-price ip-sort">297.00</td>
<td class="ip-earnings ip-sort">43</td>
<td class="ip-shares ip-sort">86</td>
<td class="ip-status {'sorter':'currency'}"><img
src="/img/assets/arrow1.png" title="0.989990234375"/></td>
<td class="ip-blank-right"></td>
</tr>
Everyone of these blocks of HTML should match separately which I then want to extract the other data from (eg. ip-name, ip-price, ip-earnings..).
But my current regex matches everything until the "(?=)"-part is not true anymore:
http://regexhero.net/tester/?id=2b491d15-ee83-4dc7-8fe9-62e624945dcf
What do I need to change to have every block as a match?
Greetings! :)
PS.: Hope it is understandable what I mean...
This should get all the tr rows:
<tr class="tr-list[\s\S]+?</tr>
This should get all the tr rows with matching groups for the columns:
<tr class="tr-list[^<]*?<td class="ip-img">(.*?)</td>\s*<td class="ip-name.*?">(.*?)</td>\s*<td class="ip-price.*?">(.*?)</td>\s*<td class="ip-earnings.*?">(.*?)</td>\s*<td class="ip-shares.*?">(.*?)</td>\s*<td class="ip-status.*?">([\s\S]*?)</td>[\s\S]+?</tr>
nested html will require nested array from regular expression's match
it can be done using jquery or manually generate a tree using regular expression
This Regular Expression will capture a whole html block that is not self-enclosed:
var hmtlText="<div bar='baz'>foo</foo>";
var pattern = /<([\w]+)( (( +)?[\w]+=['"](\w+)?['"])?)+( )?(\/)?>((([\t\n\r\s]+)?)+(((.)+)?)+((\10)?)+)+?<\/(\1)>/igm;
console.log((pattern.test(htmlText) ? 'valid' : 'invalid') + ' html block');