Очистить входные значения формы JSF после отправки

Если у вас есть форма и есть текстовое поле и кнопка, как вы удаляете содержимое текстового поля после отправки формы?

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

После ввода значения в текстовое поле и отправки, значение все равно появляется в текстовом поле. Мне нужно очистить содержимое текстового поля после его отправки. Как я могу достичь этого?

Ответ 1

Вы можете очистить форму от метода 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`

Обратите внимание, что метод clear() вызывается из метода сохранения после завершения всех операций метода сохранения. В качестве опции вы можете выполнить очистку только в том случае, если операция методов прошла успешно... Метод ниже помещен в класс ProductController...

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

Вызов метода из представления /jsp будет выглядеть следующим образом:

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

Ответ 2

Вы можете очистить свойство управляемого 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 к просмотру обрабатываются в соответствии с стандартным запросом-ответом-ответом JSF. В соответствии с жизненным циклом управляемое содержимое bean обновляется со значением из запроса (т.е. Устанавливается значение DataForm.Name) до того, как выполняется событие приложения (DataForm.submit). Когда страница отображается в фазе Render Response, текущее значение bean используется для визуализации представления обратно пользователю. Если значение не будет изменено в событии приложения, значение всегда будет равно тому, которое применяется в запросе.

Ответ 3

Введение

Есть несколько способов добиться этого. Наивный способ состоит в том, чтобы просто удалить поля в резервную копию bean. Безумный способ - захватить JS/jQuery для задания, которое делает это после отправки или даже во время загрузки страницы. Эти способы вводят ненужный код и указывают на проблему мышления/дизайна. Все, что вам нужно, только начинается с нового запроса/страницы/просмотра/bean. Как и в случае с запросом GET.

POST-Redirect-GET

Лучший способ - это просто отправить перенаправление после отправки. Вы, наверное, уже слышали об этом: POST-Redirect-GET. Он дает вам новый новый запрос GET после запроса POST (форма отправки), в точности так, как вы предполагали. Это имеет дополнительное преимущество, поскольку ранее представленные данные не были повторно отправлены, когда конечный пользователь неосведомленно нажимает F5 и игнорирует предупреждение браузера.

Существует несколько способов выполнения PRG в JSF.

  • Просто вернитесь к тому же представлению с строкой запроса faces-redirect=true. Предполагая /page.xhtml, вы можете сделать это в методе действий:

    public String submit() {
        // ...
    
        return "/page.xhtml?faces-redirect=true";
    }
    

    Если вы все еще играете с навигационными примерами в режиме JSF 1.x, то это вопрос добавления <redirect/> к рассматриваемому навигационному делу. См. Также Как сделать перенаправление с помощью правила навигации.

  • Чтобы сделать его более многоразовым, вы можете получить идентификатор вида программно:

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

    В любом случае, если у вас есть параметры просмотра, которые необходимо сохранить в URL-адресе запроса, добавьте &includeViewParams=true к результату. См. Также Сохранение параметров строки запроса запроса GET в форме формы JSF.

  • Если вы используете какое-либо решение для перезаписи URL-адресов, которое выполняется за пределами контекста JSF, тогда вам лучше всего взять текущий URL-адрес запроса (с строкой запроса) и использовать ExternalContext#redirect() для перенаправления на это.

    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

Обратите внимание, что это все работает только красиво в сочетании с запросом или просмотром области beans. Если у вас есть привязанный к форме сеанс bean, то bean не будет воссоздан с нуля. У вас есть еще одна проблема, которая также должна быть решена. Разделите его на меньшую область сеанса, ограниченную сеансом, для данных с областью охвата и областью видимости для данных с охватом представления. См. Также Как выбрать правильную область bean?

Сообщения о лицах

Если у вас есть сообщение лица, которое будет отображаться как результат успешного действия, просто сделайте его флеш-сообщением. См. Также Как показать сообщение лиц на странице с перенаправлением.

public String submit() {
    // ...

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

Ajax

Только если у вас есть страница только для ajax, на которой F5 всегда запускает новый новый запрос GET, то просто обнуление полей модели в методе действия не должно сильно навредить.

См. также:

Ответ 4

Вы можете сделать это с помощью 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>

Код jQuery:

$('#newProjectForm').children('input').on('click', function(){$('#newProjectForm').find('table').find('input').val('');});

Ответ 5

Я добавил фрагмент кода, как reset все значения для текущего ViewRoot, рекурсивно для JSF 2: Reset все поля в форме

Это работает для представленных форм, показывающих ошибки проверки, а также для вновь введенных значений в форме.