0

我对 Primeface 和 JQuery 有点陌生。我有一个数据表，我想在 jquery 中访问该数据表的特定单元格。以下是我正在尝试做的 -

我的数据表代码：

<p:dataTable id="employeeDataTable" var="employee" value="#{userPreferenceBean.employeeDataModel}"
            paginator="true" rows="10" selection="#{userPreferenceBean.selectedEmployeeList}" rowIndexVar="rowIndex">

            <f:facet name="header">
                List of Employees
            </f:facet>

            <p:column selectionMode="multiple" style="width:2%" />

            <p:column headerText="Primary Employee" style="width:2%">
                <p:commandButton value="Me" update=":#{p:component('primaryEmployeeDetails')}" id="ajax"
                    actionListener="#{userPreferenceBean.saveEmployee}" styleClass="ui-priority-primary">
                    <f:param name="employeeName" value="#{employee.name}" />
                </p:commandButton>
            </p:column>

            <p:column headerText="Name" style="width:48%">
                    #{employee.name}
            </p:column>

            <p:column headerText="Department" style="width:48%">
                    #{employee.department}
            </p:column>

            <f:facet name="footer">
                <p:commandButton id="submit" value="Save Preferences" icon="ui-icon-disk"
                    update=":#{p:component('selectedEmployeeDetails')}" />
            </f:facet>
        </p:dataTable>

现在我想从 JQuery 的特定单元格（例如第 n 行和第 2 列）访问命令按钮。这就是我现在正在做的——

$(document).ready(function() {
        $(".ui-priority-primary").click(function() {
            alert('test')
            var row = 'employeeDataTable:' + rowIndex + ':ajax';
            $(row).each(function() {
                alert('test again')
            });
        });
});

现在带有“测试”的警报正在工作，但带有“再次测试”的警报不起作用。这意味着我能够从命令按钮获取点击事件。但在我看来，我无法从数据表中获取特定的单元格。你能帮我理解我在这里犯了什么错误吗？谢谢。

问候， Sudipta Deb

生成的 HTML

4

1 回答 1

0

比方说，您想在带有 的行rowIndex和带有 的列中获取单元格columnIndex。因此，通过 jQuery 获取该单元格的方法如下：

$(document.getElementById("myForm:employeeDataTable"))
    .find("tbody:first").children("tr:nth-of-type(" + rowIndex + ") td:nth-of-type(" + columnIndex + ")")

由于您需要绝对 ID，因此最好给父级指定一个正确的名称，或者您可以使用它document.getElementById("#{p:component('employeeDataTable')}")来代替，因此 primefaces 会为您进行 ID 查找。
我使用document.getElementById而不是 jQuery ID-selector #，因为那样你将不得不转义每个:.

因此，对于您给定的功能，请使用以下内容：

var row = $(document.getElementById("myForm:employeeDataTable")).find("tbody:first").children("tr:nth-of-type(" + rowIndex + ")");
row.each(function() {
  alert('test again')
});

test again为 的每一行发出警报dataTable。

于 2013-09-17T09:26:59.403 回答