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

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

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

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

5 ответов


вы можете очистить форму от метода 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 () вызывается из метода save после завершения всех операций метода save. В качестве опции вы можете выполнить очистку только в том случае, если операция методов была успешной...Метод ниже помещается в класс ProductController...

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

вызов метода из view/jsp будет выглядеть как Следующий:

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

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

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


введение

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

после перенаправления-GET

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

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

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

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

    если вы все еще возитесь с навигационными кейсами JSF 1.X путь, то это вопрос добавления <redirect/> в случае навигации в вопрос. См. также как сделать перенаправление с помощью navigation-rule.

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

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

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

  3. если вы используете какое-то решение для перезаписи 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

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

Лица Сообщения

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

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, а затем просто обнуление поля (полей) модели в методе действия не должно нанести большого вреда.

Читайте также:


Вы можете сделать это с 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('');});

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

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