Question

当使用datatable datatable in-cell edit ajax primeface更新一行时，我有同步rowEdit更新其他行的问题。
但无法使用ajax调用更新其他行。 ajax响应仅返回已更新的相同行数据。

代码如下：

<h:form id="testForm">
    <p:dataTable id="testDT" var="d" rowIndexVar="rowIndex"
        value="#{testBean.lists}" editable="true">
        <p:column>
            <f:facet name="header">No</f:facet>
            <h:outputText value="#{rowIndex}" />
        </p:column>
        <p:column headerText="Value">
            <p:cellEditor>
                <f:facet name="output">
                    <h:outputText value="#{d.value}" />
                </f:facet>
                <f:facet name="input">
                    <p:inputText value="#{d.value}" size="5" />
                </f:facet>
            </p:cellEditor>
        </p:column>
        <p:column headerText="Edit" style="width:50px">
            <p:outputPanel rendered="#{d.editable}">
                <p:rowEditor>
                </p:rowEditor>
            </p:outputPanel>
        </p:column>
        <p:ajax event="rowEdit" update=":testForm:testDT"
            listener="#{testBean.onRowUpdate}" />
    </p:dataTable>
    </h:form>

我的TestBean：

package web.bean.test;

  import java.util.ArrayList;
  import java.util.List;

  import javax.annotation.PostConstruct;
  import javax.faces.bean.ManagedBean;
  import javax.faces.bean.ViewScoped;

  import org.primefaces.event.RowEditEvent;

  @ManagedBean(name="testBean")
  @ViewScoped
  public class TestBean {
private List<TestData> lists = new ArrayList<>();

@PostConstruct
    protected void init() {
    TestData d = new TestData("Row1Data", 1d, true);
        lists.add(d);
    d = new TestData("Row1Data", 11.11d, false);
    lists.add(d);
}

public void onRowUpdate(RowEditEvent event) {
    Object o = event.getObject();
    if (o != null) {
        TestData d = (TestData)o;
        TestData d1 = lists.get(1);
        d1.setValue(d1.getValue() + d.getValue());
    }
}

public List<TestData> getLists() {
    return lists;
}

public void setLists(List<TestData> lists) {
    this.lists = lists;
}
 }

 package web.bean.test;

 public class TestData {
private String name;
private double value;
private boolean editable;

public TestData(String name, double value, boolean editable) {
    super();
    this.name = name;
    this.value = value;
    this.editable = editable;
}
public TestData() {
}
public String getName() {
    return name;
}
public void setName(String name) {
    this.name = name;
}
public double getValue() {
    return value;
}
public void setValue(double value) {
    this.value = value;
}
public boolean isEditable() {
    return editable;
}
public void setEditable(boolean editable) {
    this.editable = editable;
}


 }

ajax响应机构：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head><link type="text/css" rel="stylesheet" href="/Octopus-G/javax.faces.resource/theme.css.xhtml?ln=primefaces-bluesky" /><link type="text/css" rel="stylesheet" href="/Octopus-G/javax.faces.resource/primefaces.css.xhtml?ln=primefaces&amp;v=3.2" /><script type="text/javascript" src="/Octopus-G/javax.faces.resource/jquery/jquery.js.xhtml?ln=primefaces&amp;v=3.2"></script><script type="text/javascript" src="/Octopus-G/javax.faces.resource/primefaces.js.xhtml?ln=primefaces&amp;v=3.2"></script></head><body>
<form id="testForm" name="testForm" method="post" action="/Octopus-G/test.xhtml" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="testForm" value="testForm" />
<div id="testForm:testDT" class="ui-datatable ui-widget"><table role="grid"><thead><tr role="row"><th id="testForm:testDT:j_idt5" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>No</span></div></th><th id="testForm:testDT:j_idt8" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>Value</span></div></th><th id="testForm:testDT:j_idt12" class="ui-state-default" role="columnheader" style="width:50px"><div class="ui-dt-c"><span>Edit</span></div></th></tr></thead><tfoot></tfoot><tbody id="testForm:testDT_data" class="ui-datatable-data ui-widget-content"><tr data-ri="0" class="ui-widget-content ui-datatable-even" role="row"><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell" class="ui-editable-column"><div class="ui-dt-c"><span id="testForm:testDT:0:j_idt9" class="ui-cell-editor"><span class="ui-cell-editor-output">1.0</span><span class="ui-cell-editor-input"><input id="testForm:testDT:0:j_idt11" name="testForm:testDT:0:j_idt11" type="text" value="1.0" size="5" class="ui-inputfield ui-inputtext ui-widget ui-state-default ui-corner-all" /><script id="testForm:testDT:0:j_idt11_s" type="text/javascript">PrimeFaces.cw('InputText','widget_testForm_testDT_0_j_idt11',{id:'testForm:testDT:0:j_idt11'});</script></span></span></div></td><td role="gridcell" style="width:50px"><div class="ui-dt-c"><span id="testForm:testDT:0:j_idt13"><span id="testForm:testDT:0:j_idt14" class="ui-row-editor"><span class="ui-icon ui-icon-pencil"></span><span class="ui-icon ui-icon-check" style="display:none"></span><span class="ui-icon ui-icon-close" style="display:none"></span></span></span></div></td></tr><tr data-ri="1" class="ui-widget-content ui-datatable-odd" role="row"><td role="gridcell"><div class="ui-dt-c">1</div></td><td role="gridcell" class="ui-editable-column"><div class="ui-dt-c"><span id="testForm:testDT:1:j_idt9" class="ui-cell-editor"><span class="ui-cell-editor-output">11.11</span><span class="ui-cell-editor-input"><input id="testForm:testDT:1:j_idt11" name="testForm:testDT:1:j_idt11" type="text" value="11.11" size="5" class="ui-inputfield ui-inputtext ui-widget ui-state-default ui-corner-all" /><script id="testForm:testDT:1:j_idt11_s" type="text/javascript">PrimeFaces.cw('InputText','widget_testForm_testDT_1_j_idt11',{id:'testForm:testDT:1:j_idt11'});</script></span></span></div></td><td role="gridcell" style="width:50px"><div class="ui-dt-c"></div></td></tr></tbody></table></div><script id="testForm:testDT_s" type="text/javascript">$(function() {PrimeFaces.cw('DataTable','widget_testForm_testDT',{id:'testForm:testDT',editable:true,behaviors:{rowEdit:function(event) {PrimeFaces.ab({source:'testForm:testDT',process:'testForm:testDT',update:'testForm:testDT',event:'rowEdit'}, arguments[1]);}}});});</script><input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="-8223787210091934199:-360328890338571623" autocomplete="off" />
</form></body>
</html>

Answer 1

将ajax事件调度程序放在rowEditor的一侧并使用@all引用。

<p:rowEditor>
  <p:ajaxStatus update="@all" listener="#{testBean.onRowUpdate}"/>
</p:rowEditor>

使用ajax rowEdit事件处理，使用数据表格内单元编辑来更新同一数据表中的其他行

1 个答案: