Question

我一直试图弄清楚如何突出显示表格中的选定行。在我的jsp中，我有jsp scriplet，可以访问displaytag库正在创建的行的id。我想将它与用户$ {currentNoteId}选择的当前行的id进行比较。现在，如果行id = 849（硬编码），则将“currentClass”类添加到表的该行中。我需要更改{$ currentNoteId}的849，我不知道该怎么做。我正在使用java，Spring MVC。 jsp： ...

<%
request.setAttribute("dyndecorator", new org.displaytag.decorator.TableDecorator()  
{  
   public String addRowClass()  
   {  
      edu.ilstu.ais.advisorApps.business.Note row =               
      (edu.ilstu.ais.advisorApps.business.Note)getCurrentRowObject();      
            String rowId = row.getId();
            if ( rowId.equals("849") ) {
                return "currentClass";
            }
            return null;              
        }
    });
%> 

<c:set var="currentNoteId" value="${studentNotes.currentNote.id}"/>
...
<display:table id="noteTable" name="${ studentNotes.studentList }" pagesize="20"
  requestURI="notesView.form.html" decorator="dyndecorator">
    <display:column title="Select" class="yui-button-match" href="/notesView.form.html"
      paramId="note.id" paramProperty="id">
      <input type="button" class="yui-button-match2" name="select" value="Select"/>
    </display:column>
    <display:column property="userName" title="Created By" sortable="true"/>
    <display:column property="createDate" title="Created On" sortable="true" 
       format="{0,date,MM/dd/yy hh:mm:ss a}"/>
    <display:column property="detail" title="Detail" sortable="true"/>
</display:table>
...

这也可以使用javascript完成，这可能是最好的，但文档建议这样，所以我想我会尝试。我无法在任何地方找到使用addRowClass（）的示例，除非比较是行中已经存在的字段（文档示例中使用了一个金额）或者像“849”id那样硬编码。

感谢您提供的任何帮助。

Answer 1

我继续用javascript代替它。当我在scriptlet中使用currentNoteId时：

String rowId = row.getId();
String noteId = (String) pageContext.getAttribute("currentNoteId");
if ( rowId.equals( noteId ) ) {
    return "currentClass";
}
return null;

我收到错误：got error无法引用在另一个方法中定义的内部类中的非final变量pageContext。

所以我写了：

function highlightCurrentTableRow(tableId, currentRowId ) {
    var table = document.getElementById(tableId);
    var rows = table.getElementsByTagName("tr");
    console.log( "rowId", "'" + currentRowId + "'" );
    for (i = 1; i < rows.length; i++) {
        rowId = rows[i].getElementsByTagName("td")[0].innerHTML;
        console.log( "  rowId", "'" + rowId + "'" );
        if ( rowId == currentRowId ) {
            console.log( "got here" );
            var rowClass = rows[i].getAttribute("class");
            rows[i].setAttribute("class", rowClass + " currentClass"   );  
        };
    }
}

实际上这可能不适用于IE，因为“class”是一个关键词，所以我使用了Yahoo YUI addClass（element，class）代替所以我替换了

var rowClass = rows[i].getAttribute("class");
rows[i].setAttribute("class", rowClass + " currentClass"   );

与

YAHOO.util.Dom.addClass(rows[i],'currentClass');

使用DisplayTag库，我希望使用TableDecorator使当前选定的行具有唯一的自定义类

1 个答案: