0

当用户使用 ajax 在输入文本中键入内容时，我会自动为单选按钮选择一个值。问题是：当用户在输入文本中输入内容并通过点击直接提交表单时Get，表单并没有提交，而是因为 change 事件而只调用了 ajax 并更新了单选。

第二次点击Get按钮，提交表单。

我也不想使用keyup，因为它可能会在打字时打扰用户。

我使用primefaces 5.1

这是我的代码：

<h:form id="myForm">
    <p:selectOneRadio
        value="#{myBean.include}" id="IncludeRadio">
        <f:selectItem itemValue="Include" itemLabel="Include" />
        <f:selectItem itemValue="Exclude" itemLabel="Exclude" />
        <p:ajax process="@this" update="@form" />
    </p:selectOneRadio>
    <p:radioButton id="IncludeRadio0" for="IncludeRadio" itemIndex="0"/>
    <p:radioButton id="IncludeRadio1" for="IncludeRadio" itemIndex="1"/>

    <p:inputText
        value="#{myBean.fieldValue}"
        id="FieldValueInputText">
        <p:ajax process="@this" update="@form" />
    </p:inputText> 

    <p:commandButton id="GetButton"
                action="#{myBean.execute}"
                value="Get">
    </p:commandButton>
</h:form>

和豆子：

@ManagedBean
@SessionScoped
public class MyBean {
    public void setFieldValue(final String fieldValue) {
        if (fieldValue != null && !fieldValue.trim().isEmpty()) {
            if (!"Include".equals(getInclude())
                    && !"Exclude".equals(getInclude())) {
                setInclude("include");
            }
        } else {
            setInclude("");
        }
    }

    public void setInclude(String include) {
        this.include = include;
    }

    public String getInclude() {
        return this.include;
    }

    public void execute() {
        // do something
    }
}
4

1 回答 1

1

submit button does not submit but only triggers InputText's onChange event

That happened because the blur event of the input field ajax-updates the submit button around the moment you click it. This way the JavaScript/Ajax logic associated with submit button is not guaranteed to work anymore, because the source element is removed from the DOM.

Make sure that you don't cover the submit button in the ajax update.

Instead of updating the entire form,

<p:ajax ... update="@form" />

update only the pieces which really need to be updated, which are only the inputs in your specific case:

<p:ajax ... update="IncludeRadio FieldValueInputText" />

Or if you'd rather like to not keep track of all those IDs when you have many inputs, grab PFS:

<p:ajax ... update="@(#myForm :input)" />
于 2016-02-09T11:15:17.050 回答