我不确定我是否迟到了,但是让我就如何使用PrimeFaces的纯ajax功能更新一行内容发表我的意见。
1)部分更新: 我使用PF更新特定行中的某些内容的第一种方法并不是完全更新整个行,而是更新行内感兴趣的区域。这可以通过定义持有面板并更新它们来实现。例如:
<h:form id="testForm">
<p:dataTable id="myEntityTable" var="myEntity" value="#{myController.allEntities}">
<p:column headerText="id">
<h:outputText value="#{myEntity.id}"/>
</p:column>
<p:column headerText="last update">
<p:outputPanel id="lastUpdatePanel">
<h:outputText value="#{myEntity.lastUpdate}">
<f:convertDateTime pattern="HH:mm:ss" type="date" />
</h:outputText>
</p:outputPanel>
</p:column>
<p:column headerText="counter">
<p:outputPanel id="counterPanel">
<h:outputText value="#{myEntity.counter}"/>
</p:outputPanel>
</p:column>
<p:column headerText="increment">
<p:commandButton value="+"
actionListener="#{myController.increment(myEntity)}"
update="counterPanel, lastUpdatePanel"/>
</p:column>
</p:dataTable>
</h:form>
关键在于更新目标面板(在这个例子中是片段
update="counterPanel, lastUpdatePanel"
)。这会产生类似以下图片的效果:
![enter image description here](https://istack.dev59.com/54rHH.webp)
2) 实际更新行:通常情况下,前面的方法已经足够好用了。但是,如果真的需要更新行,则可以按照之前的回答中给出的建议使用@row
关键字:
<h:form id="testForm">
<p:dataTable id="myEntityTable" var="myEntity" value="#{myController.allEntities}" rowIndexVar="rowIndex">
<p:column headerText="id">
<h:outputText value="#{myEntity.id}"/>
</p:column>
<p:column headerText="last update 1">
<p:outputPanel>
<h:outputText value="#{myEntity.lastUpdate}">
<f:convertDateTime pattern="HH:mm:ss" type="date" />
</h:outputText>
</p:outputPanel>
</p:column>
<p:column headerText="last update 2">
<h:outputText value="#{myEntity.lastUpdate}">
<f:convertDateTime pattern="HH:mm:ss" type="date" />
</h:outputText>
</p:column>
<p:column headerText="counter">
<p:outputPanel>
<h:outputText value="#{myEntity.counter}"/>
</p:outputPanel>
</p:column>
<p:column headerText="increment">
<p:commandButton value="+"
actionListener="#{myController.increment(myEntity)}"
update="@form:myEntityTable:@row(#{rowIndex})"/>
</p:column>
</p:dataTable>
</h:form>
诀窍在于将每列内容放入
p:outputPanel
中,并让
update="@form:myEntityTable:@row(#{rowIndex})"
完成工作。我故意没有在"last update 2"列中使用outputPanel以说明这一点:
![enter image description here](https://istack.dev59.com/uEMik.webp)
因此,虽然“最后更新1”和“计数器”列在单击“+”后实际上会更新,但“最后更新2”列保持不变。因此,如果您需要更新内容,请使用
outputPanel
进行包装。值得注意的是,包含每个列内容的输出面板不需要显式ID(如果您想要添加一个,则可以添加)。
为了完整起见,在这些示例中,我使用了PF 6.2。后端bean非常简单:
package myprefferedpackage;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
@ManagedBean
@ViewScoped
public class MyController {
private List<MyEntity> entities;
@PostConstruct
public void init() {
this.entities = new ArrayList<MyEntity>(10);
for(int i = 0; i < 10; ++i) {
this.entities.add(new MyEntity(i));
}
}
public List<MyEntity> getAllEntities() {
return entities;
}
public void increment(MyEntity myEntity) {
myEntity.increment();
}
public class MyEntity {
private int id;
private int counter;
private Date lastUpdate;
public MyEntity(int id) {
this.id = id;
this.counter = 0;
this.lastUpdate = new Date();
}
public void increment() {
this.counter++;
this.lastUpdate = new Date();
}
public int getId() {
return id;
}
public int getCounter() {
return counter;
}
public Date getLastUpdate() {
return lastUpdate;
}
}
}