jquery - 在丰富的 :dataTable the background color of the datatable row disappears

Question

我在我的元素中使用了jsf richfaces。用户单击特定行后，我必须突出显示 richfaces 数据表中的行。我使用 jquery 突出显示该行。但是在我们单击该行后，该行的背景颜色消失了。如果我给了 jQuery.noConflict();背景颜色仍然存在，但页面未呈现且操作标记不起作用。任何人都可以帮助我解决这个问题..

数据表列值:

<rich:dataTable value="#{myBean.list}" var="bean" >
<rich:column>
<a4j:commandLink value="#{bean.id}" render="info,tablepanel" action="#
{myBean.save(bean.id)}" onclick="changeBackground(this)" />
</rich:column>  
</rich:dataTable>

J查询:

<script>
function changeBackground(element){
/* jQuery.noConflict(); */
jQuery(element).parents('tr:first').addClass('backgroundRed');
 }
</script>

CSS:

<style>
.backgroundRed {
color: #555658;
background-color: yellow;
cursor : pointer;
}
</style>

提前致谢..

Answer 1

您可以使用以下代码执行此操作:

<rich:dataTable value="#{myBean.list}" var="bean" >
     <rich:column>
         <a4j:commandLink value="#{bean.id}" render="info,tablepanel" action="#/>
     </rich:column>  
     <a4j:support event="onRowClick" oncomplete="highlightSingleRow(this)"/>
</rich:dataTable>

Javascript:

jQuery.noConflict();
function highlightSingleRow(col) {
    jQuery(col).parent().parent().find('tr').removeClass('highlight-row');
    jQuery(col).parent().addClass('highlight-row');
}

CSS:

.highlight-row {
    background-color: yellow;
    cursor : pointer;
}