How to send form input values and invoke a method in JSF bean

Question

I am building a JSF application. I defined the GUI and did the select statements query the database using select.

Now I must do the insert statements, but I don't know how to read the value of a JSF input component like <h:inputText> and send it to my bean which performs the insert.

Should <h:inputText> value be mapped through faces-config.xml, so I can have it in my Java code?

Answer 1

You need to put all <h:inputXxx>/<h:selectXxx> components in a <h:form> and bind their value attribute to a bean property via an EL expression like #{bean.property}, backed by a getter/setter pair. When properly set, JSF will automatically set the values in the bean when the form is submitted via a <h:commandXxx> component in the very same form. You can specify a bean action method in action attribute of the <h:commandXxx> component via an EL expression like #{bean.action}, which points to the bare method action(). All submitted values are available right away there the usual Java way.

Given this JSF form example with one input field and one select field:

<h:form>
    <h:inputText value="#{bean.text}" required="true" />
    <h:selectOneMenu value="#{bean.choice}" required="true">
        <f:selectItem itemValue="#{null}" />
        <f:selectItem itemValue="One" />
        <f:selectItem itemValue="Two" />
        <f:selectItem itemValue="Three" />
    </h:selectOneMenu>
    <h:commandButton value="submit" action="#{bean.submit}" />
    <h:messages />
    <h:outputText value="#{bean.result}" />
</h:form>

The following bean prints the submitted values to the stdout, proving that JSF has already set the values long before the moment you access it in the action method.

package com.example;

import javax.inject.Named;
import javax.enterprice.context.RequestScoped;

@Named // Use @javax.faces.bean.ManagedBean on outdated environments.
@RequestScoped // Use @javax.faces.bean.RequestScoped on outdated environments.
public class Bean {

    private String text;
    private String choice;
    private String result;

    public void submit() {
        result = "Submitted values: " + text + ", " + choice;
        System.out.println(result);
    }

    public String getText() {
        return text;
    }

    public void setText(String text) {
        this.text = text;
    }

    public String getChoice() {
        return choice;
    }

    public void setChoice(String choice) {
        this.choice = choice;
    }

    public String getResult() {
        return result;
    }
}

That's all. Turning the regular form into an ajax form is a matter of nesting a <f:ajax> in the command component as below.

<h:commandButton value="submit" action="#{bean.submit}">
    <f:ajax execute="@form" render="@form" />
</h:commandButton>

You can find another example and valuable links at bottom of our JSF wiki page.

Do note that whatever you intend to do with the submitted values is beyond the responsibility of JSF. For example, manipulating it, passing into another class, saving it in database, etc. None of this all is related to JSF. It has as being a HTML form based framework already done its job of providing you the submitted values in flavor of usable Java variables. The remainder is up to you.

To investigate the next step, you should at this point just be doing as if you've already a bunch of prepared / hardcoded variables instead of a whole JSF based user interface. For example, in order save to the values in a database, people usually use a business service layer framework like EJB which in turn uses a persistence layer framework like JPA. Some people even use "plain vanilla" JDBC for that. For more links to concrete examples, start here: JSF Controller, Service and DAO.