3 Replies Latest reply on Aug 4, 2010 4:55 AM by ilya_shaikovsky

    commandButton's action not executed inside a rich:suggestionbox

    zlatko99

      Hi there,

       

      I have a problem with <h:commandButton> inside a <rich:suggestionbox>. The specified action in the command button does not get executed. If I take out the <h:commandButton>, immediately after the <rich:suggestionbox>, everything works as expected. I checked the code for many already known issues (such as nested forms), but to no avail. Here follows a code snippet of the XHTML file:

       

       

      <h:form>
           <h:inputText id="userSearcher" title="Search for users..." style="width:100%"/>
           
           <rich:suggestionbox suggestionAction="#{searchUserManager.findUsers}"
                     var="searchUser"
                     for="userSearcher"
                     fetchValue="#{searchUser.firstName} #{searchUser.lastName}"
                     width="300"
                     minChars="3"
                     nothingLabel="No users found"
                     ignoreDupResponses="true" immediate="true" eventsQueue="searchUserQueue">
                
                <h:column>#{searchUser.firstName}&#160;#{searchUser.lastName}</h:column>
                <h:column>
                     <a4j:commandButton value="Add as friend" action="#{friendManager.addAsFriend(searchUser.id)}" rendered="#{searchUser.addable}" oncomplete="showInfoMessage();" reRender="friendSuggestions, addedAsFriends, addedAsFriendCount" immediate="true"/>
                </h:column>
           </rich:suggestionbox>
      </h:form>
      

       

       

      Thank you in advance,

      Zlatko

        • 1. Re: commandButton's action not executed inside a rich:suggestionbox
          ilya_shaikovsky

          It's not intended to works in that way. I do not see the use-case for using buttons in autocomplete component list. Actually we have such open requests in jira https://jira.jboss.org/browse/RF-6577 - but them not planned for now and look like not native functionality for the component.

          1 of 1 people found this helpful
          • 2. Re: commandButton's action not executed inside a rich:suggestionbox
            zlatko99

            Thanks for the response, Ilya.

             

            I partly agree with you that the functionality I'm looking for is perhaps out of context of the rich:suggestionbox component. But, take the following use-case in mind:

             

            You have a social network application with many registered users. You log in to the app, go to the "Search for friends..." text field, enter a few characters of the first name of the person you're looking for, the suggestion box gives you all the available options for the entered name, and directly in the suggestion row you click on the button "Send a friend request" for the appropriate person. Isn't this functionality convenient?

             

            For everyone that think so, I have found a pretty clean workaround. The trick is to declare an a4j:jsFunction component outside the rich:suggestionbox and call the javascript from inside the h:column using plain old <input type="button".../> component. See the example below:

             

             

            <h:form>
            
            <a4j:jsFunction name="addAsFriendJS" action="#{searchUserManager.addAsFriend()}" oncomplete="showInfoMessage();" reRender="friendSuggestions, addedAsFriends, addedAsFriendCount" immediate="true">
                 <a4j:actionparam name="friendId" assignTo="#{searchUserManager.friendId}"/>
            </a4j:jsFunction>
             
            <h:inputText id="userSearcher" title="Search for users..." style="width:100%"/>
            <rich:suggestionbox suggestionAction="#{searchUserManager.findUsers}"
                      var="searchUser"
                      for="userSearcher"
                      fetchValue="#{searchUser.firstName} #{searchUser.lastName}"
                      width="300"
                      minChars="3"
                      nothingLabel="No users found"
                      ignoreDupResponses="true" immediate="true" eventsQueue="searchUserQueue"
                 >
                 <h:column>
                      <img src="resource/image?id=#{searchUser.thumbnail}&amp;type=normal" border="0" />
                 </h:column>
                 <h:column>
                      <h4 align="left">#{searchUser.firstName}&#160;#{searchUser.lastName}</h4>
                      <a4j:outputPanel layout="block" rendered="#{searchUser.mutualFriendCount gt 0}">
                           <h:outputText value="#{searchUser.mutualFriendCount} mutual friend#{searchUser.mutualFriendCount gt 1 ? 's' : ''}" styleClass="text"/>
                      </a4j:outputPanel>
                 </h:column>
                 <h:column >
                      <a4j:outputPanel layout="none" rendered="#{searchUser.addable}">
                      <div align="right">
                           <input type="button" value="#{messages['add_as_friend']}" onclick="javascript:addAsFriendJS('#{searchUser.userId}')"/>
                      </div>
                      </a4j:outputPanel>
                 </h:column>
            </rich:suggestionbox>
            
            </h:form>
            

             

             

            I would be interested in any thoughts one might have on this one.

             

            Thanks,

            Zlatko

            • 3. Re: commandButton's action not executed inside a rich:suggestionbox
              ilya_shaikovsky

              yes.. I thought about such case Probably there are some separate popup component needed which will works just as panel and not as input extension.

               

              But your workaround looks really cool.. Why I do not thought about that Thanks for your update! Good thread for users knowledgebase.