如何使用javaScript函数为添加到数据表的最新行调用rowEditor按钮? ... 柱

如何使用javaScript函数为添加到数据表的最新行调用rowEditor按钮? ... 柱,javascript,java,eclipse,jsf,primefaces,Javascript,Java,Eclipse,Jsf,Primefaces,我想调用一个javascript函数来单击p:rowEditor,以获取我的commandButton添加的最新行。这必须在创建行时立即发生,并且行必须处于编辑模式。谢谢。答案是肯定的。转到此处的showcase页面,然后按F12键打开JavaScript控制台 <tr data-ri="14" class="ui-widget-content ui-datatable-odd" role="row"> 如果您检查编辑行图标所在的最后一行的HTML,您将看到此HTML

我想调用一个javascript函数来单击p:rowEditor,以获取我的commandButton添加的最新行。这必须在创建行时立即发生,并且行必须处于编辑模式。谢谢。

答案是肯定的。转到此处的showcase页面,然后按F12键打开JavaScript控制台

<tr data-ri="14" class="ui-widget-content ui-datatable-odd" role="row">

如果您检查编辑行图标所在的最后一行的HTML,您将看到此HTML

        <p:commandButton value="Add" icon="ui-icon-plus"
            actionListener="#{institutionView.addInst}" oncomplete="PF('institutionDataTable').addRow()" process="@this"/>
        <p:growl id="message" showDetail="true" />


  <p:dataTable id="instDisplay" var="institutionData" paginator="true"
                rows="15" rowsPerPageTemplate="5,10,15,20,25,30"
                widgetVar="institutionDataTable"
                filteredValue="#{institutionView.institutionData}"
                emptyMessage="No institutions with given criteria"
                value="#{institutionView.institutionData}" selectionMode="single"
                selection="#{institutionView.selectedModel}"
                rowSelectListener="#{institutionView.onRowSelect}"
                onRowSelectUpdate="instDisplay"
                rowKey="#{institutionData.institutionId}" rowIndexVar="rowIndex"
                editable="true">

         <p:ajax event="rowEdit" listener="#{institutionView.onRowEdit}"
                    update="instDisplay" />
         <p:ajax event="rowEditCancel"
                    listener="#{institutionView.onRowCancel}" update="msg" />

         ... columns

       <p:column headerText="Edit" style="width:32px">
          <p:rowEditor />
       </p:column>

    </p:dataTable>
请注意,它将打开最后一行进行编辑??因此,现在您只需要在为行号添加新行时找到它。每一行在TR上都有一个数据ri元素,如

$('#form\\:cars1\\:14\\:j_idt655 > .ui-row-editor-pencil').click();
因此,将oncomplete JS函数更改为类似于本说明的内容,您必须将#表单更新为表单名称,将j#U idt655更新为正确的组件id

// select the last row number
var row = $("tr[data-ri]").last().attr('data-ri');
// click the edit pencil
$('#form\\:cars1\\:'+row+'\\:j_idt655 > .ui-row-editor-pencil').click();

您好,谢谢您的回答,但它不起作用,因为添加行时,我的数据表不会更新。当我刷新页面时,它只显示更新的行。那么你就有了另一个问题。AddRow应该立即显示,就像这里的showcase示例中所示:如果您的代码没有这样工作,那么代码中还有其他问题。
// select the last row number
var row = $("tr[data-ri]").last().attr('data-ri');
// click the edit pencil
$('#form\\:cars1\\:'+row+'\\:j_idt655 > .ui-row-editor-pencil').click();
function addRowAndEdit() {
   PF('institutionDataTable').addRow();
   // select the last row number
   var row = $("tr[data-ri]").last().attr('data-ri');
   // click the edit pencil
   $('#form\\:instDisplay\\:'+row+'\\:j_idt655 > .ui-row-editor-pencil').click();
};