9 Replies Latest reply on Mar 26, 2008 3:14 PM by mteichmann.mark.teichmann.info-ag.de

    How to use s:link in rich:menuItem?

    mteichmann.mark.teichmann.info-ag.de

      <h:form>
                <rich:toolBar>
      <rich:menuItem submitMode="none" onclick="document.location.href='./HolidayRequestList.xhtml'">
                               <s:link view="/HolidayRequestList.xhtml" value="#{messages['leavemanager.menu.HolidayRequest_List']}"
                propagation="none" />
                          </rich:menuItem>                              </rich:dropDownMenu>
                </rich:toolBar>
           </h:form>



      Following the example of RichFaces dropdown menu I can open a link via a rich:dropDownMenu. Now I'd like to open a Seam link using this menu but I cannot open the link because acces is denied when using the menu. When I remove the onclick event in above code then nothing happens so the s:link seems to have no effect, even if I change the submitMode to 'ajax' of the menuItem. (Although RichFaces are involved this is a Seam specific problem because I do not know how to combine Seam with the dropdown menu)

        • 1. Re: How to use s:link in rich:menuItem?
          kahliburke.kahli.burke.wintermutesys.com

          Unfortunately the rich:dropDownMenu and rich:menuItem tags don't provide a really easy way to integrate with s:link.  However we use the following method to get around the limitation. 


          As you can see the menu item requires that a hyperlink be provided for the user to view, but it also take control of the events and doesn't allow the link to be clicked on.  When you're using the s:link tag, you don't want to specify the URL manually in the onclick event.  So take a look at the following:


              <rich:toolBar>
                <rich:toolBarGroup>
                  <rich:dropDownMenu value="Menu1" submitMode="none">
                    <rich:menuItem styleClass="menuLink" 
                        value="Your Page" rendered="#{optionalCondition}">
                      <s:link view="/yourView.xhtml"/>
                    </rich:menuItem>
                  </rich:dropDownMenu>
                  <rich:jQuery selector=".menuLink" 
                       query="click(function() {location.href = jQuery(this).find('a').attr('href') })"/>
              </rich:toolBarGroup>
          



          The jquery is applied to all elements with the menuLink tag.  You can do dynamic rendering this way, just specify a rendered attribute for the menuItem.  Make sure you specify the submitMode as none. There are variations on the theme that you can experiment with.


          Hope it helps,


          Kahli

          • 2. Re: How to use s:link in rich:menuItem?
            damianharvey.damianharvey.gmail.com

            Seems like overkill. Is there any particular reason why you need an s:link?


            You can specify a string in the action attribute of the menuItem and then define some navigation in your pages.xml to catch this action. eg



            <rich:menuItem
                 submitMode="server"
                 value="Hello"
                 action="hello">
                 <s:conversationPropagation type="end" />
            </rich:menuItem>
            


            and then in pages.xml:



            <navigation>
                 <rule if-outcome="hello">
                      <redirect view-id="/hello.xhtml" />
                 </rule>
            
            


            Cheers,


            Damian.

            • 3. Re: How to use s:link in rich:menuItem?
              kahliburke.kahli.burke.wintermutesys.com

              s:link is nice because it creates bookmarkable pages.  That may not be important depending on the use case, but we use it for some of the main areas of the application so the user can easily get back with a bookmark.

              • 4. Re: How to use s:link in rich:menuItem?
                mteichmann.mark.teichmann.info-ag.de

                The suggestion from Kahli looks indeed too complex for such a tiny task although it is always good to know some alternative approach.
                The solution from Damian works for me, but I intended to build the menu dynamically. How can I build the redirect rules dynamically? I do not intend to use jPDL. Maybe I can add a topic 'dynamic dropdown menus' in the Knowledgebase if some of you can provide me with a hint how to do this...

                • 5. Re: How to use s:link in rich:menuItem?
                  mteichmann.mark.teichmann.info-ag.de

                  Now I added a second rule but only the first one works !? I already restarted the JBoss server and tested in another browser but it only works for my first menu item :-(


                  My menu:


                  <rich:menuItem  submitMode="server"
                   value="List"
                   action="requestlist"
                   rendered="#{identity.hasRole('Service Manager')}"
                   id="navHRList">
                  <s:conversationPropagation type="end" />
                  </rich:menuItem>
                  <rich:menuItem submitMode="server"
                   value="Home"
                   action="home"
                   id="navHome">
                  <s:conversationPropagation type="end" />
                  </rich:menuItem>



                  Code in corresponding page.xml:


                  <navigation>
                               <rule if-outcome="requestlist">
                                    <redirect view-id="/HolidayRequestList.xhtml" />
                               </rule>
                               <rule if-outcome="home">
                                    <redirect view-id="/home.xhtml" />
                               </rule>
                          </navigation>





                  • 6. Re: How to use s:link in rich:menuItem?
                    damianharvey.damianharvey.gmail.com

                    I can't see a problem with it. Maybe add a few more menuItems and see if they work.


                    Good luck building the menu dynamically. It's a PITA.


                    Cheers,


                    Damian.

                    • 7. Re: How to use s:link in rich:menuItem?
                      mteichmann.mark.teichmann.info-ag.de

                      I added another entry but same result: Only the first click seams to work, after that the page is submitted but no navigation occurs.


                      It is as always with SEAM: As soon as you do not follow the examples exactly you are lost because there is so much happening in the background...
                      Simple things like a dynamic menu, navigation via doubleclick in a datatable etc. do not work because Javascript, AJAX, JSF, backing beans etc. all get mingled together and you cannot guess what is really happening unless you are in expert in all techniques used.

                      (Yes, I am not programming Java 24x7 since 100 years but with the given documentation it is very hard to reach certain goals which seem to be very easy at first but then have many pitfalls...)

                      • 8. Re: How to use s:link in rich:menuItem?
                        damianharvey.damianharvey.gmail.com

                        IMO I think that once you understand the examples you are better off then starting with a Seam-Gen project so at least your config is 100% correct. I've found it quite easy then getting things like this to work. How about posting your full page and pages.xml and I'll see if it works for me.


                        Cheers,


                        Damian.

                        • 9. Re: How to use s:link in rich:menuItem?
                          mteichmann.mark.teichmann.info-ag.de

                          I was thinking too complicated. My colleague just found a solution:



                          <rich:menuItem  value="#{messages['leavemanager.menu.HolidayRequestTeam_List']}"
                                                        action="/HolidayRequestTeamList.xhtml" />




                          Now it should be easy to build this dynamically using a bean and editing the links in a database table.