发生验证错误后，如何使用 PrimeFaces AJAX 填充文本字段? [英] How can I populate a text field using PrimeFaces AJAX after validation errors occur?
问题描述
我在视图中有一个表单，它为自动完成和 gmap 本地化执行 ajax 部分处理.我的支持 bean 实例化了一个实体对象地址"，并且表单的输入被引用到这个对象:
I have a form in a view which performs ajax partial processing for autocompletion and gmap localization. My backing bean instantiates an entity object "Address" and is to this object that the form's inputs are referenced:
@ManagedBean(name="mybean")
@SessionScoped
public class Mybean implements Serializable {
private Address address;
private String fullAddress;
private String center = "0,0";
....
public mybean() {
address = new Address();
}
...
public void handleAddressChange() {
String c = "";
c = (address.getAddressLine1() != null) { c += address.getAddressLine1(); }
c = (address.getAddressLine2() != null) { c += ", " + address.getAddressLine2(); }
c = (address.getCity() != null) { c += ", " + address.getCity(); }
c = (address.getState() != null) { c += ", " + address.getState(); }
fullAddress = c;
addMessage(new FacesMessage(FacesMessage.SEVERITY_INFO, "Full Address", fullAddress));
try {
geocodeAddress(fullAddress);
} catch (MalformedURLException ex) {
Logger.getLogger(Mybean.class.getName()).log(Level.SEVERE, null, ex);
} catch (UnsupportedEncodingException ex) {
Logger.getLogger(Mybean.class.getName()).log(Level.SEVERE, null, ex);
} catch (IOException ex) {
Logger.getLogger(Mybean.class.getName()).log(Level.SEVERE, null, ex);
} catch (ParserConfigurationException ex) {
Logger.getLogger(Mybean.class.getName()).log(Level.SEVERE, null, ex);
} catch (SAXException ex) {
Logger.getLogger(Mybean.class.getName()).log(Level.SEVERE, null, ex);
} catch (XPathExpressionException ex) {
Logger.getLogger(Mybean.class.getName()).log(Level.SEVERE, null, ex);
}
}
private void geocodeAddress(String address)
throws MalformedURLException, UnsupportedEncodingException,
IOException, ParserConfigurationException, SAXException,
XPathExpressionException {
// prepare a URL to the geocoder
address = Normalizer.normalize(address, Normalizer.Form.NFD);
address = address.replaceAll("[^\p{ASCII}]", "");
URL url = new URL(GEOCODER_REQUEST_PREFIX_FOR_XML + "?address="
+ URLEncoder.encode(address, "UTF-8") + "&sensor=false");
// prepare an HTTP connection to the geocoder
HttpURLConnection conn = (HttpURLConnection) url.openConnection();
Document geocoderResultDocument = null;
try {
// open the connection and get results as InputSource.
conn.connect();
InputSource geocoderResultInputSource = new InputSource(conn.getInputStream());
// read result and parse into XML Document
geocoderResultDocument = DocumentBuilderFactory.newInstance().newDocumentBuilder().parse(geocoderResultInputSource);
} finally {
conn.disconnect();
}
// prepare XPath
XPath xpath = XPathFactory.newInstance().newXPath();
// extract the result
NodeList resultNodeList = null;
// c) extract the coordinates of the first result
resultNodeList = (NodeList) xpath.evaluate(
"/GeocodeResponse/result[1]/geometry/location/*",
geocoderResultDocument, XPathConstants.NODESET);
String lat = "";
String lng = "";
for (int i = 0; i < resultNodeList.getLength(); ++i) {
Node node = resultNodeList.item(i);
if ("lat".equals(node.getNodeName())) {
lat = node.getTextContent();
}
if ("lng".equals(node.getNodeName())) {
lng = node.getTextContent();
}
}
center = lat + "," + lng;
}
在我处理整个表单提交之前，自动完成和映射 ajax 请求工作正常.如果验证失败，除了在视图中无法更新的字段 fullAddress 之外，ajax 仍然可以正常工作，即使它的值在 ajax 请求后正确设置在支持 bean 上也是如此.
Autocompletion and map ajax requests work fine before I process the whole form on submit. If validation fails, ajax still works ok except for the field fullAddress which is unable to update in the view, even when it's value is correctly set on the backing bean after the ajax request.
<h:outputLabel for="address1" value="#{label.addressLine1}"/>
<p:inputText required="true" id="address1"
value="#{mybean.address.addressLine1}">
<p:ajax update="latLng,fullAddress"
listener="#{mybean.handleAddressChange}"
process="@this"/>
</p:inputText>
<p:message for="address1"/>
<h:outputLabel for="address2" value="#{label.addressLine2}"/>
<p:inputText id="address2"
value="#{mybean.address.addressLine2}"
label="#{label.addressLine2}">
<f:validateBean disabled="#{true}" />
<p:ajax update="latLng,fullAddress"
listener="#{mybean.handleAddressChange}"
process="address1,@this"/>
</p:inputText>
<p:message for="address2"/>
<h:outputLabel for="city" value="#{label.city}"/>
<p:inputText required="true"
id="city" value="#{mybean.address.city}"
label="#{label.city}">
<p:ajax update="latLng,fullAddress"
listener="#{mybean.handleAddressChange}"
process="address1,address2,@this"/>
</p:inputText>
<p:message for="city"/>
<h:outputLabel for="state" value="#{label.state}"/>
<p:autoComplete id="state" value="#{mybean.address.state}"
completeMethod="#{mybean.completeState}"
selectListener="#{mybean.handleStateSelect}"
onSelectUpdate="latLng,fullAddress,growl"
required="true">
<p:ajax process="address1,address2,city,@this"/>
</p:autoComplete>
<p:message for="state"/>
<h:outputLabel for="fullAddress" value="#{label.fullAddress}"/>
<p:inputText id="fullAddress" value="#{mybean.fullAddress}"
style="width: 300px;"
label="#{label.fullAddress}"/>
<p:commandButton value="#{label.locate}" process="@this,fullAddress"
update="growl,latLng"
actionListener="#{mybean.findOnMap}"
id="findOnMap"/>
<p:gmap id="latLng" center="#{mybean.center}" zoom="18"
type="ROADMAP"
style="width:600px;height:400px;margin-bottom:10px;"
model="#{mybean.mapModel}"
onPointClick="handlePointClick(event);"
pointSelectListener="#{mybean.onPointSelect}"
onPointSelectUpdate="growl"
draggable="true"
markerDragListener="#{mybean.onMarkerDrag}"
onMarkerDragUpdate="growl" widgetVar="map"/>
<p:commandButton id="register" value="#{label.register}"
action="#{mybean.register}" ajax="false"/>
如果我刷新页面，验证错误消息就会消失，ajax 会按预期完成 fullAddress 字段.
If I refresh the page, validation error messages disappear and the ajax completes fullAddress field as expected.
在验证过程中还会发生另一个奇怪的行为:如代码所示，我已禁用表单字段的 bean 验证.这个工作正常，直到发现其他验证错误，然后，如果我重新提交表单，JSF 会对该字段进行 bean 验证！
Another weird behavior occurs also during validation: I have disabled bean validation for a form field, as seen on the code. This work alright until other validation errors are found, then, if I resubmit the form, JSF makes bean validation for this field!
我想我在验证状态中遗漏了一些东西，但我无法弄清楚它有什么问题.有谁知道如何调试 JSF 生命周期?有什么想法吗?
I guess I am missing something in during the validation state but I can't figure out what's wrong with it. Does anyone knows how to debug JSF life cycle? Any ideas?
推荐答案
考虑以下事实可以理解问题的原因:
The cause of the problem can be understood by considering the following facts:
在验证阶段，如果特定输入组件的 JSF 验证成功，则提交的值将设置为
null，并将验证的值设置为输入组件的本地值.
When JSF validation succeeds for a particular input component during the validations phase, then the submitted value is set to
nulland the validated value is set as local value of the input component.
在验证阶段，如果特定输入组件的 JSF 验证失败，则提交的值会保留在输入组件中.
When JSF validation fails for a particular input component during the validations phase, then the submitted value is kept in the input component.
当至少一个输入组件在验证阶段后无效时，JSF 将不会更新任何输入组件的模型值.JSF 将直接进入渲染响应阶段.
When at least one input component is invalid after the validations phase, then JSF will not update the model values for any of the input components. JSF will directly proceed to render response phase.
JSF在渲染输入组件的时候，会先测试提交的值是否不是null然后显示，否则如果本地值不是null> 然后显示，否则显示模型值.
When JSF renders input components, then it will first test if the submitted value is not null and then display it, else if the local value is not null and then display it, else it will display the model value.
只要您与同一个 JSF 视图交互，您就在处理相同的组件状态.
As long as you're interacting with the same JSF view, you're dealing with the same component state.
因此，当特定表单的验证失败时，您碰巧需要通过不同的 ajax 操作甚至不同的 ajax 表单更新输入字段的值(例如，根据下拉选择或一些模态对话框的结果等)，那么您基本上需要重置目标输入组件，以便让 JSF 显示在调用操作期间编辑的模型值.否则，JSF 仍会像验证失败期间一样显示其本地值，并使它们处于无效状态.
So, when the validation has failed for a particular form submit and you happen to need to update the values of input fields by a different ajax action or even a different ajax form (e.g. populating a field depending on a dropdown selection or the result of some modal dialog form, etc), then you basically need to reset the target input components in order to get JSF to display the model value which was edited during invoke action. Otherwise JSF will still display its local value as it was during the validation failure and keep them in an invalidated state.
在您的特定情况中，其中一种方法是手动收集要由 PartialViewContext#getRenderIds() 然后手动重置其状态和提交的值通过 EditableValueHolder#resetValue().
One of the ways in your particular case is to manually collect all IDs of input components which are to be updated/re-rendered by PartialViewContext#getRenderIds() and then manually reset its state and submitted values by EditableValueHolder#resetValue().
FacesContext facesContext = FacesContext.getCurrentInstance();
PartialViewContext partialViewContext = facesContext.getPartialViewContext();
Collection<String> renderIds = partialViewContext.getRenderIds();
for (String renderId : renderIds) {
UIComponent component = viewRoot.findComponent(renderId);
EditableValueHolder input = (EditableValueHolder) component;
input.resetValue();
}
您可以在 handleAddressChange() 侦听器方法中或在可重用的 ActionListener 实现，您附加为 handleAddressChange() 侦听器方法的输入组件.
You could do this inside the handleAddressChange() listener method, or inside an reuseable ActionListener implementation which you attach as <f:actionListener> to the input component which is calling the handleAddressChange() listener method.
回到具体问题，我认为这是 JSF2 规范中的一个疏忽.当 JSF 规范要求以下内容时，对我们 JSF 开发人员来说会更有意义:
Coming back to the concrete problem, I'd imagine that this is an oversight in the JSF2 specification. It would make much more sense to us, JSF developers, when the JSF specification mandates the following:
- 当 JSF 需要通过 ajax 请求更新/重新呈现输入组件，并且该输入组件未包含在 ajax 请求的进程/执行中时，JSF 应重置输入组件的值.
这已被报告为 JSF 问题 1060，并且已经在
This has been reported as JSF issue 1060 and a complete and reuseable solution has been implemented in the OmniFaces library as ResetInputAjaxActionListener (source code here and showcase demo here).
更新 1:从 3.4 版开始，PrimeFaces 基于这个想法还引入了一个完整的、可重用的解决方案，具有
Update 1: Since version 3.4, PrimeFaces has based on this idea also introduced a complete and reusable solution in flavor of <p:resetInput>.
更新 2:从 4.0 版开始，<p:ajax> 获得了一个新的布尔属性 resetValues ，它也应该可以解决此类问题，而无需额外的标签.
Update 2: Since version 4.0, the <p:ajax> got a new boolean attribute resetValues which should also solve this kind of problem without the need for an additional tag.
更新 3: JSF 2.2 引入了
Update 3: JSF 2.2 introduced <f:ajax resetValues>, following the same idea as <p:ajax resetValues>. The solution is now part of standard JSF API.
这篇关于发生验证错误后，如何使用 PrimeFaces AJAX 填充文本字段?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
