在进行Ajax更新时，JSF重置字段 [英] JSF resets fields when doing an ajax update

问题描述

我在JSF页面上遇到问题，在该页面上，我在第一个帐单名字"字段中键入了一个名字.如果我点击复制帐单邮寄地址复选框；这将停止呈现传递地址面板，并通过ajax将其隐藏，我刚刚在第一个字段中键入的值将重置为之前的状态.

I have a problem on my JSF page where I type a name into the first billing first name field. If I click on copy billing address checkbox; this stops rendering the delivery address panel and hides it via ajax, the value I just typed into the first field gets reset to its previous state.

JSF页面

<h:form>
    <p:inputText value="#{addressBean.billingAddress.firstName}" required="true"/ >

    <p:selectBooleanCheckbox value="#{addressBean.copyBillingAddress}" id="duplicateBillingDetails">
        <f:ajax render="@form" />
    </p:selectBooleanCheckbox>

    <h:panelGrid rendered="#{not addressBean.copyBillingAddress}" columns="3">
        <p:inputText value="#{addressBean.deliveryAddress.firstName}"/>
    </h:panelGrid>

    <p:commandButton value="Checkout" action="#{addressBean.saveAddress}"/>
</h:form>

后备豆

@Component
@Scope("view")
public class AddressBean implements Serializable {
    @Inject
    private CurrentUserBean currentUserBean;
    @Inject
    private UserService userService;
    private Address deliveryAddress = new Address();
    private Address billingAddress = new Address();
    private boolean copyBillingAddress;


    public AddressBean() {

    }

    public boolean isCopyBillingAddress() {
        return copyBillingAddress;
    }

    public void setCopyBillingAddress(boolean copyBillingAddress) {
        this.copyBillingAddress = copyBillingAddress;
    }


    public String saveAddress() {
        if (copyBillingAddress) {
            deliveryAddress = new Address(billingAddress);
        }

        User user = currentUserBean.getUser();
        if (!billingAddress.isSame(user.getBillingAddress())) {
            user.setBillingAddress(billingAddress);
        }
        if (!deliveryAddress.isSame(user.getDeliveryAddress())) {
            user.setDeliveryAddress(deliveryAddress);
        }
        currentUserBean.setUser(userService.save(user));
        return "/checkout.xhtml";
    }

    public CurrentUserBean getCurrentUserBean() {
        return currentUserBean;
    }


    public void setCurrentUserBean(CurrentUserBean currentUserBean) {
        this.currentUserBean = currentUserBean;
    }

    public Address getDeliveryAddress() {
        return deliveryAddress;
    }

    public void setDeliveryAddress(Address deliveryAddress) {
        this.deliveryAddress = deliveryAddress;
    }

    public Address getBillingAddress() {
        return billingAddress;
    }

    public void setBillingAddress(Address billingAddress) {
        this.billingAddress = billingAddress;
    }




}

推荐答案

默认情况下，<f:ajax>仅处理当前组件，如execute="@this"所示.因此，所有其他输入组件的提交值将不会被处理，因此不会更新到模型中.但是，您通过render="@form"强制使用所有其他输入组件的当前(未更新！)模型值刷新表单的整个HTML输出.

The <f:ajax> processes by default only the current component as in execute="@this". So the submitted values of all other input components won't be processed and thus not be updated into the model. However, you're by render="@form" forcing the entire HTML output of the form to be refreshed with current (non-updated!) model values of all other input components.

假设您的意图是不要不必要地转换/验证/更新所有其他输入组件，则最好使render属性更具体.仅更新真正需要更新的内容，而不是整个表单.

Assuming that your intent is to not unnecessarily convert/validate/update all other input components, you'd better make the render attribute more specific. Update only the content which really needs to be updated and not the entire form.

<p:selectBooleanCheckbox value="#{addressBean.copyBillingAddress}" id="duplicateBillingDetails">
    <f:ajax render="copyBillingAddress" />
</p:selectBooleanCheckbox>

<h:panelGroup id="copyBillingAddress">
    <h:panelGrid rendered="#{not addressBean.copyBillingAddress}" columns="3">
        <p:inputText value="#{addressBean.deliveryAddress.firstName}"/>
    </h:panelGrid>
</h:panelGroup>

或者，如果您确实需要render="@form"，则需要添加execute="@form"以便告诉<f:ajax>也处理所有其他输入组件.

Or, if you really need the render="@form", then you need to add a execute="@form" in order to tell <f:ajax> to process all other input components as well.

<f:ajax execute="@form" render="@form" />

请注意，这可能不必要地触发了这些输入组件的转换/验证.

Note that this may unnecessarily trigger conversion/validation on those input components.

• 为什么我需要嵌套带有render ==#{some}"的组件?在另一个组件中，当我想对其进行ajax更新时?

这篇关于在进行Ajax更新时，JSF重置字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！