0

here is what i am trying to achieve: I have a page that consists of a lot of (autocomplete) inputs that are used to select the same type of object (all in a different context). Every single input has to offer the ability to open a popup where the user can do a specific lookup (using more filter options and selecting the desired object from a list of search results).

So i thought this would be the perfect reusable component and wrote the following composite component:

<cc:interface>
    <cc:attribute name="value" type="MySelectedObjectType" />
    <cc:attribute name="render" type="java.lang.String" />
</cc:interface>
<cc:implementation>
    <rich:popupPanel id="dialog" header="#{msg.search}" autosized="true">
        <h:form id="form">
            <h:panelGroup class="searchPane" layout="block">
                <h:panelGrid>
                    <o:outputLabel for="name" value="#{msg.name}" />
                    <h:inputText id="name" value="#{lookupModel.name}" />

                    ...
                </h:panelGrid>
                <div class="extSearchPaneButton-cntr">
                    <a4j:commandButton value="Suchen" action="#{lookupModel.doSearch}" render="searchResult" styleClass="buttonDefault" />
                </div>
            </h:panelGroup>
            <h:panelGroup id="searchResult" layout="block" class="searchResult-cntr">
                <rich:dataTable id="resultTable" value="#{lookupModel.searchResults}" var="entry" >
                    <rich:column>
                        #{entry.name}
                    <rich:column>
                    ...
                    <a4j:ajax event="rowclick" listener="#{lookupModel.selectionListener}" />
                </rich:dataTable>
            </h:panelGroup>
            <div class="resultButton-cntr">
                <a4j:commandButton id="apply" value="#{msg.apply}" execute="searchResult" oncomplete="#{rich:component('dialog')}.hide()"
                    styleClass="button" render="#{cc.attrs.render}">
                    <f:setPropertyActionListener target="#{cc.attrs.value}" value="#{lookupModel.selected}" />
                </a4j:commandButton>
                <a4j:commandButton id="cancel" value="#{msg.cancel}" onclick="#{rich:component('dialog')}.hide(); return false;"
                    styleClass="button" />
            </div>
        </h:form>
    </rich:popupPanel>
</cc:implementation>

The lookupModel is a ViewScoped (with RequestScope it was not possible to select a row in the datatable) ManagedBean independent from the ManagedBean used on the Page (for reusing it in another page).

My problem is now, that if i have 5 inputs that use this popup, i have to put 5 popups in my page, bloating the component tree and the resulting page size, where only one can be active at a time. I wonder what must be done to be able to use only one lookup component on my page and reuse it for every input that needs it. The problem i face is, that i don't know how to handover the targeted value that the lookup should set on apply (see the setPropertyActionListener).

As a sidenote, every time the lookup is shown it's content is reset (reseting the backing bean and rendering the page content), there's no need to remember the last search results.

Thanks in advance.

dag
  • 1,133
  • 12
  • 25

1 Answers1

0

Doubt it would be possible.

For something like this, I would more or less skip JSF for rendering and make a Javascript that does what your composite component does now. Then change the component so it simply initializes the Javascript with needed data and handles input from the Javascript so it can be parsed to a managed bean.

Bjørn Stenfeldt
  • 1,432
  • 1
  • 18
  • 25
  • Doubt you are kind of right. The only thing i could imagine was to give the backing bean two properties one for the targeted object and one for it s property and set these before opening the popup. On the apply i can use Reflection to the the value, but that's far from what i call easy to maintain... – dag Mar 19 '13 at 09:36