How to populate certain text field after selecting item from <h:selectOneMenu /> JSF 2.0

Question

i want that, when user select item in a inputText field populates with data from database.

I have a select menu list:

<h:selectOneMenu id="blah" value="#{controller.selected.id}" title="#{bundle.CreateTitle_id}" > 
     <f:selectItems value="#{controller.listOfId()}" />
</h:selectOneMenu>

and let's say have input text like this:

<h:inputText value="In here we place value from backing bean"></h:inputText>

How can i make after selecting an item from a list(which holds the id) populate text field with other data from my backing bean(let's say a name).

Here is my backingBean:

@ManagedBean(name = "controller")
@SessionScoped
public class Bean implements Serializable {

private Catalog current;// here i'm holding int id, String name and other stuff...
private DataModel items = null;
@EJB
private probaSession.CatalogFacade ejbFacade;
private PaginationHelper pagination;
private int selectedItemIndex;

public KatalogController() {
}

public Katalog getSelected() {
    if (current == null) {
        current = new Catalog();
        selectedItemIndex = -1;
    }
    return current;
}

private KatalogFacade getFacade() {
    return ejbFacade;
}

public PaginationHelper getPagination() {
    if (pagination == null) {
        pagination = new PaginationHelper(10) {

            @Override
            public int getItemsCount() {
                return getFacade().count();
            }

            @Override
            public DataModel createPageDataModel() {
                return new ListDataModel(getFacade().findRange(new int[]{getPageFirstItem(), getPageFirstItem() + getPageSize()}));
            }
        };
    }
    return pagination;
}

//......

public ArrayList<Catalog> listOfId()  { 
          ArrayList<Catalog> list=new ArrayList<Catalog>();
   try{

    String upit="select id from Catalog";

   Statement st=connection.createStatement(); 
   ResultSet rs=st.executeQuery(upit);

   while(rs.next()) {

      Katalog k=new Katalog();
      k.setId(rs.getInt(1));
      k.setName(rs.getString(2));





         list.add(k);


   }

 disconnect();


   }
   catch (Exception ex) {
       ex.printStackTrace();
   }

   return list;
}

and that's pretty much it.

I'm here if anything needs to explaining. It think it is easy(using ajax let's say) but i don't even know how to start doing it...

Answer 1

You must add an f:ajax (that is standard, many component library offer extended versions) to catch a change event in the inputText

<h:selectOneMenu id="blah" value="#{controller.selected.id}" title="#{bundle.CreateTitle_id}" >
  <f:selectItems value="#{controller.listOfId()}" />
  <f:ajax
     event="change"        <-- The event to capture. I believe that if not specified
                                 there is a default event to capture from
                                 each component (for inputText it would be "change")
     render="myForm:foo"  <-- Only repaint "blah"
     listener="#{controller.myBlahListener}"
</h:selectOneMenu>

<h:inputText id="foo" value="#{controller.fooText}"/>

Your listener will read the new value in this.getSelected().getId() , and change the model so that controller.getFooText() returns the new value (the easiest way probably is this.setFooTest(this.getSelected().getId() , but that depends of your model.