完成<p:ajax event ="cellEdit">后更新整个<p:dataTable>

Question

一旦编辑了一个单元格,我就很难重新渲染PrimeFaces Datatable.更改一个单元格中的值可能会更改其他单元格中的条目,因此需要刷新整个表格.

这是JSF页面:

<h:form id="testForm">
    <p:outputPanel id="testContainer">

        <p:dataTable id="testTable" value="#{tableBean.data}" var="entry" editable="true" editMode="cell">

            <p:ajax event="cellEdit" listener="#{tableBean.onCellEdit}" update=":testForm:testContainer" />

            <p:column headerText="Col1">  
                <p:cellEditor>
                    <f:facet name="output"><h:outputText value="#{entry.col1}" /></f:facet>
                    <f:facet name="input"><p:inputText value="#{entry.col1}" /></f:facet>
                </p:cellEditor> 
            </p:column>

            <p:column headerText="Col2">
                <p:cellEditor>
                    <f:facet name="output"><h:outputText value="#{entry.col2}" /></f:facet>
                    <f:facet name="input"><p:inputText value="#{entry.col2}" /></f:facet>
                </p:cellEditor>  
            </p:column>

        </p:dataTable>

        <p:commandButton id="refreshButton" value="Redisplay" update="testContainer" />

    </p:outputPanel>                                    
</h:form>

这是支持bean:

@ManagedBean(name = "tableBean", eager = false)
@ViewScoped 
public class TableBean {

    public TableBean() {
        RowData entry = new RowData("a1", "b1");
        entries.add(entry);
        entry = new RowData("a2", "b2");
        entries.add(entry);
        entry = new RowData("a3", "b3");
        entries.add(entry);
    }

    public class RowData {

        private String col1;
        private String col2;

        public RowData(String col1, String col2) {
            this.col1 = col1;
            this.col2 = col2;
        }

        public String getCol1() {
            return col1;
        }

        public void setCol1(String col1) {
            this.col1 = col1;
        }

        public String getCol2() {
            return col2;
        }

        public void setCol2(String col2) {
            this.col2 = col2;
        }
    }

    private ArrayList<RowData> entries = new ArrayList<RowData>();

    public List<RowData> getData() {
        return entries;
    }

    public void onCellEdit(CellEditEvent event) {
        entries.get(event.getRowIndex()).setCol1("Dummy Col 1");
        entries.get(event.getRowIndex()).setCol2("Dummy Col 2");        
    }   
}

在cellEdit AJAX事件中包含update =":testForm:testContainer"时,更改单元格值会删除屏幕上的数据表并仅呈现单元格内容(以及按钮) - 我不明白为什么会这样.如果未指定update属性,则表格将保留在屏幕上并更新活动单元格,但不会更新任何其他单元格(如预期的那样).

通过不在AJAX cellEdit事件中指定update属性并在编辑单元格的值后单击Redisplay按钮,可以实现所需的行为(以非自动方式).我怎样才能以自动方式实现这一点,为什么更新属性不能像我期望的那样工作？

我正在使用PrimeFaces 4.0.

Answer 1

该rowEdit和cellEdit设计表里面没有更新/重新渲染什么比当前行一样,即使是在中明确指定的事件确实update属性.这是PrimeFaces有点过分热衷于尽量减少响应大小的结果.在大多数情况下这是有道理的,但在具体情况下并非如此.值得一个问题报告.

同时,在他们修复此行为之前,最好的办法是使用<p:remoteCommand>调用所需的侦听器方法并执行表的完整更新.

改写

<p:dataTable ...>
    <p:ajax event="cellEdit" listener="#{tableBean.onCellEdit}" update=":testForm:testContainer" />
    ...
</p:dataTable>

至

<p:remoteCommand name="onCellEdit" action="#{tableBean.onCellEdit}" update="testContainer" />
<p:dataTable ...>
    <p:ajax event="cellEdit" oncomplete="onCellEdit()" />
    ...
</p:dataTable>

Answer 2

BaLusC解决方案并没有直接为我工作.onCellEdit需要一个CellEditEvent作为参数.我的解决方法如下:

<p:remoteCommand name="onCellEdit" update="testContainer" />
<p:dataTable ...>
    <p:ajax event="cellEdit" listener="#{tableBean.onCellEdit}" oncomplete="onCellEdit()" />
    ...
</p:dataTable>

Answer 3

如果没有一个解决方案适合你,这对我有用

<p:dataTable ... id="theId" widgetVar="theWidget" ...>
                <p:ajax event="rowEdit" listener="#{...}"
                        oncomplete="PF('theWidget').filter()"/> 
....

我在ajax完成上调用PF小部件上的过滤器方法,任何执行表"重新加载"的方法都应该有效,我使用过滤器,因为我的表有列过滤器.