Search code examples
javaspringjspjstl

Iterate Map Inside List in order to display the values as row in JSP

i need to display the value which is inside Map, and Map is inside List. Right now, My values are displaying but in column manner (as shown in sceenshot). not in row manner, I want to display all the values as column manner

enter image description here

As you can see in above image, take first record, 100 should be mapped with column Pay Code BASIC PAY should be mapped with Description 25300 should be mapped with Amount and 2, is useless, I don't want this to display it anymore.

my service method which fetches the data:

public List<Map<String, Object>> searchPayCodeByempCode(String tabSuffix, String empCode, String yyyyMm) {
    MapSqlParameterSource param = new MapSqlParameterSource();
    String tableName = "Salary_detail_report_082018";
    String query = "SELECT "
            + " DISTINCT PAY_CODE, "
            + " PAY_CODE_DESC, "
            + " AMOUNT, "
            + " row_number() over (Order by EMP_CODE ) AS ROW_NUM "
            + " FROM " + tableName
            + " WHERE EMP_CODE=" + empCode
            + " AND YYYYMM=" + yyyyMm
            + " AND PAY_CODE NOT IN (997,998,999) "
            + " ORDER BY PAY_CODE ASC ";
    List<Map<String, Object>> employees = queryForList(query);
    if (employees != null && !employees.isEmpty()) {
        for (Map<String, Object> employee : employees) {
             System.out.println("The set is: " + employee.keySet()); 
            for (Iterator<Map.Entry<String, Object>> it = employee.entrySet().iterator(); it.hasNext();) {
                Map.Entry<String, Object> entry = it.next();
                String key = entry.getKey();
                Object value = entry.getValue();
                System.out.println(key + " = " + value);
            }
        }
    }
    return employees;

JSP code:

 <table class="table table-striped table-bordered dataTable no-footer tableWidth"  role="grid" name="employeeList" id="employeeList">
                                <thead>
                                    <tr>
                                        <th width="5%">S. No.</th>
                                        <th width="10%">Pay Code</th>
                                        <th width="15%">Description</th>
                                        <th width="10%">Amount</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <c:forEach var="map" items="${mapList}">
                                        <c:forEach var="mapEntry" items="${map}">
                                            <tr>
                                                <%--<td>test : ${mapEntry.key}</td>--%>
                                                <td>test : ${mapEntry.value}</td>
                                            </tr>
                                        </c:forEach>
                                    </c:forEach>
                                </tbody>
                            </table>

Expected output:

enter image description here

Solution

  • You should iterate list items as table rows (<tr>) and for each row iterate map from list item as a table cell (<td>):

    <tbody>
    <c:forEach var="map" items="${mapList}">
        <tr>
            <c:forEach var="mapEntry" items="${map}">
                <td>${mapEntry.value}</td>
            </c:forEach>
        </tr>
    </c:forEach>
</tbody>

    The difference is in <tr> position.

    If you have more items in the map and want to render only first 4 you can use status var and index value to filter them:

    <c:forEach var="mapEntry" items="${map}" varStatus="status">
    <c:if test="${status.index <= 4 }">
        <td>${mapEntry.value}</td>
    </c:if>
</c:forEach>

    But if you have map in a bad order (for example when using HashMap) then it is better to render cells selectively:

    <tbody>
    <c:forEach var="map" items="${mapList}">
        <tr>
            <td width="5%">${map.get("ROW_NUM")}</td>
            <td width="10%">${map.get("PAY_CODE")}</td>
            <td width="15%">${map.get("PAY_CODE_DESC")}</td>
            <td width="10%">${map.get("AMOUNT")}</td>
        </tr>
    </c:forEach>
</tbody>