在JQuery中从PrimeFaces数据表中查找特定单元格

Question

我是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')
            });
        });
});

现在，带有'test'的警报正在运行，但是'再次测试'的警报无效。这意味着我可以从命令按钮获取click事件。但在我看来，我无法从数据表中获取特定的单元格。你能帮我理解我在这里做的错误吗？感谢。

此致 Sudipta Deb

Answer 1

假设您希望将单元格放在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。