1 2 Previous Next 16 Replies Latest reply: Mar 19, 2013 12:11 AM by Brian Leathem RSS

Richfaces 4 rich:autocomplete pass selected item id to backing bean

Faisal khan Newbie

I am using richfaces 4 autocomplete component following is my sample code

 

Auto complete logic searches for stationName or stationCode but when user select any option i want only its ID to pass into the backing bean how can i acheive this any quick help pls?


<rich:autocomplete showButton="true"  value="#{supplierSearchBean.filterTO.stationCode}" minChars="2"  
                      var = "station" autocompleteMethod="#{supplierSearchBean.autocomplete}" >

                        <rich:column>
                            <b>#{station.stationName}</b>
                        </rich:column>

                        <rich:column>
                            <b>#{station.stationCode}</b>
                        </rich:column>

                    </rich:autocomplete>

 

  • 1. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Brendan Healey Master

    Unfortunately there's something missing from the autocomplete component that would allow you to

    do this. There seems to be no sensible way for the value to be other than the text that you display

    to the user, which puts you somewhere between a difficult and an impossible situation. I ended up

    writing my own custom component to do this. See also here:

     

    https://community.jboss.org/message/719906#719906

     

    Regards,

    Brendan.

  • 2. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Akaine Harga Novice

    Impossible? Could a converter help?

  • 3. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Andrea Martino Newbie

    Hi all, I think I found the solution to this problem:

     

    This other post contains the detailed solution:

    https://community.jboss.org/message/741503#741503

  • 4. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Rizwan Ali Newbie

    Hi Brendan,

     

    Can you please give me a little description of how to achive this by your custom component. I am new to richface. May be this will be my first custom component. Can you please gide me how to start it?  I have tried a alot of workround but they are not working properly.

     

    Thanks in advance.

  • 5. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Rizwan Ali Newbie

    Andrea,

     

    The solution you found is not working when you select an element from list by keyboard i mean by hitting enter no thing happened.... But by doing the selection with mouse its works fine even great....

     

    Let me know if you solve this issue.

  • 6. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Andrea Martino Newbie

    Hi Rizwan,

     

    I also noticed this issue, when an item is selected using the keyboard the event does not contain information about the HTML element that triggered it...

     

    After several attemps I opted to another trick, which works fine but is not *nice*: I temporarily put the ID of the entity at the end of the string and I parse it in the controller. The result of this is that for a very short time the user sees the ID of the entity in the UI:

     

     

    <a4j:jsFunction name="updateVal"
        execute="autocompletiontest"
        render="autocompletiontest" >
    
    <rich:autocomplete
        id="autocompletiontest"
        value="#{testtest.value}"
        autocompleteMethod="#{testtest.suggest}"
        fetchValue="#{result.firstName}, #{result.lastName} (#{result.id})"
        var="result" ignoreDupResponses="true"
        onselectitem="updateVal()">
        <h:outputText value="#{result.firstName}, #{result.lastName}" style="font: menu;">
    </rich:autocomplete>
    

     

    And in the setter I parse the string and I strip off the entity ID at the end of the string:

     

    public void setValue(String value) {
        if (value != null) {
            java.util.regex.Pattern p = java.util.regex.Pattern.compile("^.*\\((-?\\d+)\\)[ \\t]*$");
            java.util.regex.Matcher m = p.matcher(value);
            try {
                if (m.matches()) {
                    // save the entity id in the managed bean and strip the 
                    // entity id from the suggested string
                    this.resultId = Long.parseLong(m.group(1));
                    this.value = value.substring(0, value.lastIndexOf('('));
                }
            } catch (java.lang.NumberFormatException e) {
                // ?!?
            }
        }
    }
    

     

    PS: third edit, I hope this time the HTML looks fine

  • 7. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Rizwan Ali Newbie

    Thanks Andrea,

     

    Let my try and then I will send you my feedback. But in the end i think we have to write a custom richface autocomplete component to facilitate the ID submission on server side.

    But again thansk for such a quick response.

  • 8. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Sascha Janz Master

    i had the same problem using richfaces 3.3.3

     

    they solution i found here

     

    http://www.imixs.org/roller/ralphsjavablog/entry/richfaces_suggestionbox_and_hidden_field

     

     

    i think it should work for richfaces 4 also.

  • 9. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Andrea Martino Newbie

    Hi Sascha, The solution that works for Richfaces 3.3.x using  does not work with <rich:autocomplete> in Richfaces 4.x.

     

    If you try to do the same, an exception will be thrown when the JSF page is parsed:

     

    Exception during request processing:   Caused by javax.servlet.ServletException with message: "/public/test.xhtml @62,93 <f:setPropertyActionListener> Parent is not of type ActionSource, type is: org.richfaces.component.UIAutocomplete@1ab74e1"
    

     

    I'm pretty sure that without expanding <rich:autocomplete> or writing a new UIComponet it is not possible to achieve what was possible in RichFaces 3.3.3...

  • 10. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Rizwan Ali Newbie

    Hi everyone,

     

    Anyone have ever try custom component for this purpose. If some one try by creating a custome component please share you code or reference I really need that.

     

    Thanks.

  • 11. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Pramod Kankure Newbie

    I discovered two ways to do this.

     

    1) In the fetchvalue select the id  and replace that with the name and immediately do f:ajax and re-render form. The backing bean will get the id that was selected  and you can do whatever processing you want to do with it. However, this has a usability problem. After fetchvalue is executed, the id is temporarily displayed in the inputbox.

     

    2) This second solution avoids the problem mentioned in the first one.

     

    Here are the steps

     

    Step 1 - code the autocomplete box as below. Key parts are highlightly. You create two rich columns one with the hidden id and the other with the name of the employee

     

     

            <rich:autocomplete layout ="table" id="employeeName" value="#{backingbean.employeeName}" 

                       autocompleteMethod="#{backingbean.autocomplete}"

                       autofill="false"

                       mode="ajax" minChars="2"

                       var ="employeeData" fetchValue="#{employeeData.name}"  required="true"

                       onselectitem="processSelectEvent(event.target);">

                  <rich:column>

                   <h:inputHidden id="contId" value="#{employeeData.id}"/>

                      </rich:column>  

                    <rich:column>

                       <h:outputText value="#{employeeData.name}" />

                    </rich:column>

             </rich:autocomplete>

     

    Step 2 - code a javascript function as

     

       function processSelectEvent (target)

                {

               updateVal(target.previousElementSibling.children[0].value);

                }

     

    Step 3 - Add following to your JSF

     

    <a4j:jsFunction name="updateVal" render="@form">

               <a4j:param name="val" assignTo="#{backingbean.employeeId}"/>

           </a4j:jsFunction>

     

     

    This works for me and should work for you. If you have not yet started with RichFaces.. you can select primefaces . the autocomplete widget there will avoid the above coding. Hope it saves u guys lot of time!!

  • 12. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Akaine Harga Novice

    Here, you said this! Use PrimeFaces instead. I'm sorry, RF devs, I could make almost anything with RF 3.3.3 but after weeks of trying v4.x (and I made several attempts btw) my final conclusion is: v4.x is a step backwards from v3.3.3, period. Too many aditional/custom code required, absolutely no documentation and very poor examples on reserved words for events/scopes or embedded RF javascript, etc.

  • 13. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Juraj Húska Expert

    Hello Akaine,

     

    firstly thanks for your feedback. It is appreciated.

     

    Secondly, could you please help us to make it better and by this to help others as well ?

     

    Could you please summarize examples of additional code you are speaking about ? What documentation are you missing (Have you checked this: http://www.jboss.org/richfaces/docs)?

     

    Thanks.

  • 14. Re: Richfaces 4 rich:autocomplete pass selected item id to backing bean
    Nejc G Newbie

    I agree, the docs are very scarce. Also my gripes: no label attribute on certain components, sometimes very specific ways to implement certain functionality (a4j panels for tooltips, tabpanel hell etc), ecss hell - some components just have internal styles and skin file does not have all properties exposed. You also cannot override those specific ecss since they are not present anywhere (generated in code I guess, I was sifting through source and couldn't find em though, docs say nothing). Check the docs about changing the appearance. Classes are mentioned, but what if I don't want to override the css class, just modify current ecss file as to keep it compatible with skins? There are quite a few other things but yea. I guess I could help a bit. I plan to learn how to make jsf components soon, so I will be back if I don't decide to just use basic faces and make those 3 components I miss.

     

    Overall RF4 is nice, but it really has some ugly holes a dev can fall into

     

    But yea, its not all the fault of RF, there are qutie a few JSF implementation loopholes.

1 2 Previous Next