如何突出显示DisplayTag表的特定行?

时间:2012-09-26 11:04:38

标签: jsp displaytag

我想突出显示具有值'Total'的DisplayTag行,我试图通过javascript但是我可以这样做.Below是我正在使用的片段。请指导。

参考:How to decorate a row in table using displaytag

当第二列中有“总计”但我没有突出显示时,我收到警报。

如何在第二列中突出显示值Total的特定行?

<script type="text/javascript">
        function onLoad(){
            var table = document.getElementById("data");    
            var tbody = table.getElementsByTagName("tbody")[0];
            var rows = tbody.getElementsByTagName("tr");

            for (i=0; i < rows.length; i++) {
                var value = rows[i].getElementsByTagName("td")[1].firstChild.nodeValue;

                if (value == 'Total') {
                    alert('true');
                    rows[i].style.backgroundColor = "red";

                            }
            }
        }

        </script>
    <body onload="onLoad();">
    <%AppUtil oAppUtil=new AppUtil();%>
    <jsp:useBean id="realTimeIssuance" scope="session" class="com.mindcraft.mis.tpd.actionform.afRealTimeIssuance"></jsp:useBean>

    <display:table name="realtimereportcol" export="true" pagesize="30" sort="list" id="data" requestURI="" class="tablelist" decorator="org.displaytag.decorator.TotalTableDecorator">


            <display:column title="SUB_CHANNEL" sortable="true" property="sub_channel"></display:column>
            <display:column title="AGENT_NAMES" sortable="true" property="agent_names"></display:column>
            <display:column title="FTD" sortable="true" property="ftd"  ></display:column>
            <display:column title="MTD" sortable="true" property="mtd"  ></display:column>
            <display:column title="QTD" sortable="true" property="qtd"  ></display:column>

    </display:table>
    </body>
    </html>

3 个答案:

答案 0 :(得分:3)

使用TableDecorator并实现类似下面的addRowClass()方法......

return ((ListObject)getCurrentRowObject()).getTotal() > 400 ? "highlight" : null;

然后,您可以在CSS文件中定义要突出显示的CSS。

请参阅他们的演示以获取更多信息http://demo.displaytag.org/displaytag-examples-1.1/example-rowclass.jsp

答案 1 :(得分:1)

您必须使用DisplayTag装饰器来操作渲染表的数据和html结构。

在项目包中创建一个简单的Java类,它扩展 TableDecorator 并覆盖 addRowClass 方法。

在类对象的集合上,为集合中的每个对象调用装饰器类方法 addRowClass

public class TestTableDecorator extends TableDecorator {

    @Override
    public String addRowClass() {
        return ((AnObject) getCurrentRowObject()).getTotal() > your_threshold ? "css-class-1" : "css-class-2";
    }   

}

现在在你的.jsp文件中使用属性:

在display:table中声明你的装饰器
decorator="path.to.decorator.TestTableDecorator"

希望有所帮助。

答案 2 :(得分:0)

AFAIK,您无法在<tr>上设置背景颜色。相反,您必须在每个封闭的<td>上设置它。

我会定义一个类似

的CSS类
tr.highlighted td {
    background-color: red;
}

并将课程highlighted添加到相应的<tr>