1

我在 JSF 数据表上应用 JQuery 时遇到问题。

我有这样的代码：

<script type="text/javascript" charset="utf-8">
            $(document).ready(function() {
                $('<b>#example</b>').dataTable( {
                    "aoColumns": [
                        { "asSorting": [ "asc" ] },
                        { "asSorting": [ "asc" ] },
                        { "asSorting": [ "desc", "asc", "asc" ] },
                        { "asSorting": [ "desc" ] },
                        { "asSorting": [ "asc" ] },
                        { "asSorting": [ "asc" ] }
                    ]
                } );
            } );
        </script>

XHTML

<h:dataTable id="example" name="example" value="#{notificationBean.notificationList}" var="item"
                cellpadding="0" cellspacing="0" border="0"
                styleClass="display"
                rowClasses="gradeC"
                style="background-image: url('../images/ClientCare_Menu_Gradient.jpg'); background-repeat: repeat-x;">

渲染时：

<table id="searchform:example" class="display" cellspacing="0" cellpadding="0" border="0" style="background-image: url('../images/ClientCare_Menu_Gradient.jpg'); background-repeat: repeat-x;">

现在我的问题是必须申请数据表的 CSS 没有得到应用。

我尝试了不同的表示法，但它在我试过的 Jquery 中不起作用：

${'#searchform:example'}, ${'#searchform.example'} 在这些情况下，包含表本身的悬停操作将无法显示数据表。

${'searchform#example'}, ${'#example'} 在这些情况下，悬停动作有效并且数据表被渲染，但 CSS 不适用

任何人都可以帮忙吗？

提前感谢迪帕克

4

1 回答 1

1

您需要选择生成的 HTML<table>元素的客户端 ID，而不是通过 JSF<h:dataTable>组件的组件 ID。HTML ID 在您的特定情况下searchform:example。由于:是 CSS 选择器中的非法字符，您需要对其进行转义：

$("#searchform\\:example")

或改用属性选择器：

$("[id='searchform:example']")

更容易的是改为提供<h:dataTable>样式类。

<h:dataTable styleClass="example">

在您的特定情况下，您已经有一个

<h:dataTable styleClass="display">

所以你也可以只使用

$(".display")
于 2012-04-25T16:57:03.640 回答