提交按钮不提交只触发InputText的onChange事件
submit button does not submit but only triggers InputText's onChange event
当用户使用 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
}
}
submit button does not submit but only triggers InputText's onChange event
发生这种情况是因为输入字段 ajax 的 blur
事件在您单击它的那一刻更新了提交按钮。这样,与提交按钮关联的 JavaScript/Ajax 逻辑不再保证有效,因为源元素已从 DOM 中删除。
确保您没有在 ajax 更新中覆盖提交按钮。
而不是更新整个表单,
<p:ajax ... update="@form" />
仅更新真正需要更新的片段,这些片段只是您特定情况下的输入:
<p:ajax ... update="IncludeRadio FieldValueInputText" />
或者如果您不想在有很多输入时跟踪所有这些 ID,请获取 PFS:
<p:ajax ... update="@(#myForm :input)" />
当用户使用 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
}
}
submit button does not submit but only triggers InputText's onChange event
发生这种情况是因为输入字段 ajax 的 blur
事件在您单击它的那一刻更新了提交按钮。这样,与提交按钮关联的 JavaScript/Ajax 逻辑不再保证有效,因为源元素已从 DOM 中删除。
确保您没有在 ajax 更新中覆盖提交按钮。
而不是更新整个表单,
<p:ajax ... update="@form" />
仅更新真正需要更新的片段,这些片段只是您特定情况下的输入:
<p:ajax ... update="IncludeRadio FieldValueInputText" />
或者如果您不想在有很多输入时跟踪所有这些 ID,请获取 PFS:
<p:ajax ... update="@(#myForm :input)" />