7 Replies Latest reply on Aug 15, 2016 2:05 AM by Scott Wesley

    Navigation Bar and List Region output do not match

    Scott Wesley

      I'm a big fan of using SQL to populate a List, which in turn represents a menu.

       

      I'm having an issue where for a given List, the Navigation Bar output does not match a region using the same List.

      navbar_menu.png

      The green tick is where the List region using Navigation Bar template (Universal Theme) shows sub menu options that differ between sub menus, as expected.

      The red tick shows the the right hand sub menu is just replicating the entries from "First sub". Second Sub does the same thing.

       

      I've triple checked my data, and I'm sure the ordering is fine, as demonstrated by List region.

      I checked out the template and thought maybe the Sublist Items portion of the template was missing a closing LI tag, but that didn't make a difference, and the List region honours it correctly.

      I reversed the first expression in the order by and the replicated submenu options where 'Reporting, Another App, And another, Logout', not 'Sub 1, Sub 2'.

       

      Would love some suggestions!

       

      Sample

      https://apex.oracle.com/pls/apex/f?p=9850:1

      Workspace : swesley

      User: otn

      pwd: forum

       

      List SQL

      select lvl,label,target,is_current_list_entry,image,image_attribute,image_alt_attribute, attribute01, attribute02,attribute03 
      from menu_data 
      order by page_group_name, order_dropdown
      

       

      Source data

      create table menu_data (lvl number
       ,label varchar2(200)
       ,target varchar2(200)
       ,is_current_list_entry  varchar2(200)
       ,image  varchar2(200)
       ,image_attribute varchar2(200)
       ,imagE_alt_attribute  varchar2(200)
       ,attribute01  varchar2(200)
       ,attribute02  varchar2(200)
       ,attribute03 varchar2(200)
       ,pagE_group_name  varchar2(200)
       ,order_dropdown  number);
      
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (1,'Find','f?p=MYPAPP:FIND::::::',null,'fa-search',null,null,null,null,null,'a',1);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (1,'Base','f?p=MYAPP:BASE::::::',null,'fa-bullseye',null,null,null,null,null,'b',2);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (1,null,'f?p=201:DEBUG::',null,'fa-bug',null,null,null,null,null,'c',3);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (1,'First sub','f?p=SUB:HOME:::NO:::',null,null,null,null,null,null,null,'d102',0);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (2,'sub 1','#',null,'fa-hashtag',null,null,null,null,null,'d102',216856);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (2,'sub 2','#',null,'fa-hashtag',null,null,null,null,null,'d102',216857);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (1,'Second sub','f?p=SUB2:HOME:::NO:::',null,null,null,null,null,null,null,'d103',0);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (2,'sub a','#',null,'fa-user',null,null,null,null,null,'d103',223655);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (1,'App 1','f?p=APP1:HOME:::NO:::',null,null,null,null,null,null,null,'d105',0);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (1,'App 2','f?p=APP2:HOME:::NO:::',null,null,null,null,null,null,null,'d108',0);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (1,'App 3','f?p=APP3:HOME:::NO:::',null,null,null,null,null,null,null,'d204',0);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (1,null,'#',null,'a-Icon icon-user',null,null,null,'has-username',null,'z',-1);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (2,'Reporting','f?p=REPUT:HOME:::NO:::',null,null,null,null,null,null,null,'z',0);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (2,'Another app','f?p=ANOTHER:HOME:::NO:::',null,null,null,null,null,null,null,'z',0);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (2,'And another','f?p=AND:HOME:::NO:::',null,null,null,null,null,null,null,'z',0);
      Insert into MENU_DATA (LVL,LABEL,TARGET,IS_CURRENT_LIST_ENTRY,IMAGE,IMAGE_ATTRIBUTE,IMAGE_ALT_ATTRIBUTE,ATTRIBUTE01,ATTRIBUTE02,ATTRIBUTE03,PAGE_GROUP_NAME,ORDER_DROPDOWN) values (2,'Logout',null,null,'fa-unlock-alt',null,null,null,null,null,'z',99999);
      

       

      Cheers

        • 1. Re: Navigation Bar and List Region output do not match
          fac586

          swesley_perth wrote:

           

          I'm a big fan of using SQL to populate a List, which in turn represents a menu.

           

          I'm having an issue where for a given List, the Navigation Bar output does not match a region using the same List.

          navbar_menu.png

          The green tick is where the List region using Navigation Bar template (Universal Theme) shows sub menu options that differ between sub menus, as expected.

          The red tick shows the the right hand sub menu is just replicating the entries from "First sub". Second Sub does the same thing.

           

          I've triple checked my data, and I'm sure the ordering is fine, as demonstrated by List region.

          I checked out the template and thought maybe the Sublist Items portion of the template was missing a closing LI tag, but that didn't make a difference, and the List region honours it correctly.

          I reversed the first expression in the order by and the replicated submenu options where 'Reporting, Another App, And another, Logout', not 'Sub 1, Sub 2'.

           

          Would love some suggestions!

          This is bug #23560509: Dynamic Navigation Menu works but Dynamic Navigation Bar does not

           

          Not due to be fixed until 5.1, but a workaround is suggested here.

          • 2. Re: Navigation Bar and List Region output do not match
            Scott Wesley

            Thanks, Paul. I thought it had been talked about somewhere, but I struggled to find it.

            I also think that post from Roel has been on my to-read list for a while.

            • 3. Re: Navigation Bar and List Region output do not match
              Scott Wesley

              Took me a little while to apply Roel's explanation correctly, but I succeeded by using my "page_group_name" value for all menu item IDs.

              • 4. Re: Navigation Bar and List Region output do not match
                fac586

                swesley_perth wrote:

                 

                Took me a little while to apply Roel's explanation correctly, but I succeeded by using my "page_group_name" value for all menu item IDs.

                Scott

                 

                Coincidentally, I'm also hitting this problem at present. Following the limited description of the workaround, the correct menu structure is appearing, but the links are not working. We're getting a JavaScript error:

                 

                Unable to get property 'type' of undefined or null reference

                File: desktop.min.js, Line: 32, Column: 13969

                 

                Since the correct structure is generated, this seems more likely to be due to a template problem rather than the hierarchy produced in the query. Could you post the changes you made to the list template?

                • 5. Re: Navigation Bar and List Region output do not match
                  Scott Wesley

                  I haven't fully explored outcomes yet but my links are fine.

                  Changes have been applied in the workspace above, template "Navigation bar - corrected".

                   

                  I changed references Roel mentioned to #A09# and supplied my page_group_name with named & positional association within the List definition.

                  • 6. Re: Navigation Bar and List Region output do not match
                    fac586

                    swesley_perth wrote:

                     

                    I haven't fully explored outcomes yet but my links are fine.

                    Changes have been applied in the workspace above, template "Navigation bar - corrected".

                     

                    I changed references Roel mentioned to #A09# and supplied my page_group_name with named & positional association within the List definition.

                    Thanks for that. Comparison with a working example was very helpful.

                     

                    After several hours inhabiting the nether regions of the JavaScript debugger, I discovered the problem resulted from the use of numeric values (internal IDs from APEX metadata views) in the custom list attributes. This generated HTML ID attributes on the menu items in the form "menu_37670165021773215201_0". widget.menu.js parses these IDs, apparently making the assumption that numeric components of the ID represent levels in the menu hierarchy. Making the custom attribute values alphanumeric by prefixing them with a letter to produce IDs with the format "menu_L37670165021773215201_0" solves the problem.

                     

                    Ironically I noticed a few days ago that the code generated for static menus used this type of alphanumeric identifier, but being ignorant of its significance, failed to slavishly follow this convention...were your IDs alphanumeric by design or happy accident?

                    1 person found this helpful
                    • 7. Re: Navigation Bar and List Region output do not match
                      Scott Wesley

                      Wow.

                       

                      A happy accident as I was pushing & poking positions in a menu concept we're exploring, and there are more letters than numbers.