Updating text component via selectOneMenu from ins

问题:

I have a Facelets subview called basedata-cpanel.xhtml, which gets its parameters passed via <ui:param>s:

<ui:define name="content-top">
  <h:form>
    <ui:include src="/subviews/basedata-cpanel.xhtml">
      <ui:param name="customerId"   value="#{pqHome.pq.customer.id}" />
      <ui:param name="customerName" value="#{pqHome.pq.customer.name}" />
      <ui:param name="customers"    value="#{organizationManager.allCustomers}" />        
    <ui:include />
  </h:form>
</ui:define>

In the subview, I simply want a panel below to show the currently selected customer name (the panel is for NEW and UPDATE panels/pages). I need an AJAX request for this.

Code in /subviews/basedata-cpanel.xhtml:

      <h:selectOneMenu value="#{customerId}" id="customer-select">
        <f:selectItems value="#{customers}"
                       var="customer"
                       itemValue="#{customer.id}"
                       itemLabel="#{customer.name}" />
        <f:ajax render="customer-name" />
      </h:selectOneMenu>
      <h:outputText value="#{customerName}" id="customer-name" />

I put the <f:ajax render="customer-name" /> into the select, but the outputText isn't updated. I didn't really expect it to, but...

What do I need to do to get it to work?

As the Facelets subview still has the same parameters as they were passed, how do I get "new ones" in? What's the best practice for this?

PS: pqHome is a @ViewScoped bean

回答1:

Your dropdown only changes the ID of the customer, not the customer name. Even more, it does not change the whole customer entity at all. It only changes the ID of an existing customer. This is not good.

You need to change the code to let it set the whole customer instead of only its ID. E.g.

<ui:include src="/subviews/basedata-cpanel.xhtml">
    <ui:param name="customer" value="#{pqHome.pq.customer}" />
    <ui:param name="customers" value="#{organizationManager.allCustomers}" />        
</ui:include>

with

<h:selectOneMenu value="#{customer}" id="customer-select" converter="customerConverter">
    <f:selectItems value="#{customers}" var="c" itemValue="#{c}" itemLabel="#{c.name}" />
    <f:ajax render="customer-name" />
</h:selectOneMenu>
<h:outputText value="#{customer.name}" id="customer-name" />

Don't forget to create a Converter which converts between customer ID and the Customer object and use it in the <h:selectOneMenu>.