Forms 提交后清除JSF表单输入值

如果有一个表单，并且有一个文本框和一个按钮，那么在提交表单后如何删除文本框的内容

<h:inputText id="name" value="#{bean.name}" />          
<h:commandButton id="submit" value="Add Name" action="#{bean.submit}" />

---

在文本框中输入值并提交后，该值仍显示在文本框中。提交文本框后，我需要清除文本框的内容。如何实现这一点？

您可以清空托管bean的属性，该属性在呈现响应时不应重新绘制。这可以使用类似于下面发布的代码片段的代码来完成：

private String name;

public String getName(){return name;}
public void setName(String name){this.name=name};

public String submit()
{
    //do some processing
    ...
    // blank out the value of the name property
    name = null;
    // send the user back to the same page.
    return null;
}

---

当前行为的原因可以在JSF运行时如何处理请求中找到。对视图的所有JSF请求都按照。根据生命周期，在执行应用程序事件（

DataForm.submit

）之前，使用来自请求的值（即设置

DataForm.Name

的值）更新托管bean内容。在呈现响应阶段呈现页面时，将使用bean的当前值将视图呈现回用户。除非在应用程序事件中更改该值，否则该值将始终是从请求中应用的值。

您可以从提交表单时调用的Bean方法中清除表单`

private String name;
    private String description;
    private BigDecimal price;

/*----------Properties ------------*/
/*-----Getter and Setter Methods---*/

public void save()throws SQLException{
String sql = "INSERT INTO tableName(name,description,price) VALUES (?,?,?)";
    Connection conn = ds.getConnection();
    try {

        PreparedStatement pstmt = conn.prepareStatement(sql);
        pstmt.setString(1, getName());
        pstmt.setString(2, getDescription());
        pstmt.setBigDecimal(3, getPrice());

        pstmt.executeUpdate();
    } catch (SQLException e) {
        e.getMessage();
        e.toString();
    }finally{
        conn.close();
        clear();
    }

}//End Save Method

public void clear(){
    setName(null);
    setDescription(null);
    setPrice(null);
}//end clear`

请注意，在save方法的所有操作完成后，将从save方法调用clear（）方法。作为一个选项，您只能在方法操作成功时执行清除…下面的方法放置在ProductController类中

    public String saveProduct(){
    try {
        product.save(); 
    } catch (SQLException e) {
        e.printStackTrace();
    }
    return null;
}

来自view/jsp的方法调用如下所示：

<h:commandButton value="Save" action="#{productController.saveProduct}"/>

---

您可以使用jQuery来完成

我也有类似的问题。我需要清除弹出窗口窗体

<rich:popupPanel id="newProjectDialog" autosized="true"
        header="Create new project">
        <h:form id="newProjectForm">
            <h:panelGrid columns="2">
                <h:outputText value="Project name:" />
                <h:inputText id="newProjectDialogProjectName"
                    value="#{userMain.newProject.projectName}"         required="true" />
                <h:outputText value="Project description:" />
                <h:inputText id="newProjectDialogProjectDescription"
                    value="#{userMain.newProject.projectDescription}"     required="true" />
            </h:panelGrid>
            <a4j:commandButton id="newProjectDialogSubmit" value="Submit"
                oncomplete="#{rich:component('newProjectDialog')}.hide();     return false;"
                render="projects" action="#{userMain.addNewProject}" />
            <a4j:commandButton id="newProjectDialogCancel" value="Cancel"
                onclick="#{rich:component('newProjectDialog')}.hide();     return false;" />
        </h:form>
        </rich:popupPanel>

介绍 有几种方法可以实现这一点。最简单的方法是简单地清空支持bean中的字段。疯狂的方法是抓取作业的JS/jQuery，它在提交后甚至在页面加载期间都会这样做。这些方法只会引入不必要的代码，并指出思维/设计问题。您只需要从一个新的请求/页面/视图/bean开始。就像你通过get请求得到的一样

后重定向获取 因此，最好的方法是在提交后发送重定向。你可能已经听说过了。它在POST请求（表单提交）之后为您提供一个新的GET请求，完全符合您的预期。这还有一个额外的好处，即当最终用户随后无知地按F5并忽略浏览器警告时，不会重新提交以前提交的数据

在JSF中有几种执行PRG的方法

只需使用

faces redirect=true

查询字符串返回同一视图即可。假设使用

/page.xhtml

，您可以在action方法中执行此操作：

public String submit() {
    // ...

    return "/page.xhtml?faces-redirect=true";
}

如果您仍然在用JSF1.x的方式处理导航案例，那么就需要在所讨论的导航案例中添加

。另见

要使其更易于重用，可以通过编程方式获取视图ID：

public String submit() {
    // ...

    UIViewRoot view = FacesContext.getCurrentInstance().getViewRoot();
    return view.getViewId() + "?faces-redirect=true";
}

无论哪种方式，如果您已经查看了需要保留在请求URL中的参数，那么请将

&includeViewParams=true

附加到结果中。另见

如果您正在使用某种在JSF上下文之外运行的URL重写解决方案，那么最好获取当前请求URL（带有查询字符串），并使用

ExternalContext\redirect（）

重定向到该URL

public void submit() throws IOException {
    // ...

    ExternalContext ec = FacesContext.getCurrentInstance().getExternalContext();
    StringBuffer requestURL = ((HttpServletRequest) ec.getRequest()).getRequestURL();
    String queryString = ((HttpServletRequest) ec.getRequest()).getQueryString();
    ec.redirect((queryString == null) ? requestURL.toString() : requestURL.append('?').append(queryString).toString());
}

这只是一堆乱七八糟的东西，真的应该重构成一些实用程序类

请求/查看作用域bean 请注意，这一切仅在与请求或视图范围的bean结合使用时才能很好地工作。如果将会话范围的bean绑定到表单，那么就不会从头开始重新创建该bean。你还有另一个问题需要解决。将其拆分为一个较小的会话范围的会话范围数据和一个视图范围的视图范围数据。另见

面对信息 如果您有一个faces消息作为成功操作的结果显示，那么只需将其设置为flash消息。另见

AJAX 只有当您碰巧有一个只有ajax的页面，其中F5总是会触发一个新的GET请求，那么简单地清空action方法中的model字段应该不会有太大的伤害

另见：

---

我在这里添加了一段代码片段，说明如何为JSF 2递归重置当前ViewRoot的所有值：

---

这适用于显示验证错误的已提交表单以及表单中新输入的值。

您可以使用javascript:

document.getElementById（“name”）.value=“”

处理提交时，服务器端的DataForm.name的值不能设置为空字符串吗？提交后再次呈现视图时应反映这一点。有一个

整数

值应清除或设置为0。当我采用上述方法时，它仍然给出了我之前输入的值。也许你是在重置局部变量的值<只要您引用托管bean的属性，code>Integers和

int

s都可以重置为0。谢谢您的回答。感谢itThanks提供的这本非常棒的详细指南！经过几个小时的搜索，我终于明白了如何正确地清除一个我正在努力清除的表单，也明白了正确的方法！谢谢

public void submit() throws IOException {
    // ...

    ExternalContext ec = FacesContext.getCurrentInstance().getExternalContext();
    StringBuffer requestURL = ((HttpServletRequest) ec.getRequest()).getRequestURL();
    String queryString = ((HttpServletRequest) ec.getRequest()).getQueryString();
    ec.redirect((queryString == null) ? requestURL.toString() : requestURL.append('?').append(queryString).toString());
}

public String submit() {
    // ...

    FacesContext context = FacesContext.getCurrentInstance();
    context.addMessage(clientId, message);
    context.getExternalContext().getFlash().setKeepMessages(true);
    return "/page.xhtml?faces-redirect=true";
}