ICEmobile
  1. ICEmobile
  2. MOBI-909

ContentStackMenu type accordion does not correctly render items without group headers

    Details

    • Type: Bug Bug
    • Status: Closed
    • Priority: Major Major
    • Resolution: Won't Fix
    • Affects Version/s: EE 1.3.0.GA_P01
    • Fix Version/s: None
    • Component/s: Faces
    • Labels:
      None
    • Environment:
      n/a

      Description

      When using a ContentStackMenu type accordion, if you have a contentMenuItem without a previous group header, the rendered markup is incorrect:

        Activity

        Philip Breau created issue -
        Philip Breau made changes -
        Field Original Value New Value
        Assignee Steve Maryka [ steve.maryka ] Philip Breau [ philip.breau ]
        Philip Breau made changes -
        Description When using a ContentStackMenu type accordion, if you have a contentMenuItem without a previous group header, the rendered markup is incorrect:

        {code}
        <div id="menuForm:mnu" name="menuForm:mnu">
            <div class="mobi-layoutmenu mobi-accordion" id="menuForm:mnu_acc">
                <li class="mobi-list-item" id="menuForm:mnu:_t7" name="menuForm:mnu:_t7">
                    <div class="mobi-list-item-default">
                        <a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'splash',singleSubmit: true,selClientId: 'splash',client: true, item: 'menuForm:mnu:_t7'});">splash</a>
                    </div>
                </li>
                <div class="closed" id="menuForm:mnu:_t8_sect"><div class="handle ui-bar-b" id="menuForm:mnu:_t8_hndl" onclick="ice.mobi.accordionController.toggleMenu('menuForm:mnu',this);"><span class="pointer"></span>navPanes</div><div class="mobi-layoutmenu "><ul class="mobi-list "><li class="mobi-list-item" id="menuForm:mnu:_t9" name="menuForm:mnu:_t9"><div class="mobi-list-item-default"><a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'navpane1',singleSubmit: true,selClientId: 'navpane1',client: true, item: 'menuForm:mnu:_t9'});">navpane1</a></div></li><li class="mobi-list-item" id="menuForm:mnu:_t10" name="menuForm:mnu:_t10"><div class="mobi-list-item-default"><a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'navpane2',singleSubmit: true,selClientId: 'navpane2',client: false, item: 'menuForm:mnu:_t10'});">navpane2</a></div></li><li class="mobi-list-item" id="menuForm:mnu:_t11" name="menuForm:mnu:_t11"><div class="mobi-list-item-default"><a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'navpane3',singleSubmit: true,selClientId: 'navpane3',client: false, item: 'menuForm:mnu:_t11'});">navpane3</a></div></li></ul></div></div><div class="closed" id="menuForm:mnu:_t12_sect"><div class="handle ui-bar-b" id="menuForm:mnu:_t12_hndl" onclick="ice.mobi.accordionController.toggleMenu('menuForm:mnu',this);"><span class="pointer"></span>input</div><div class="mobi-layoutmenu "><ul class="mobi-list "><li class="mobi-list-item" id="menuForm:mnu:_t13" name="menuForm:mnu:_t13"><div class="mobi-list-item-default"><a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'inppane1',singleSubmit: true,selClientId: 'inppane1',client: true, item: 'menuForm:mnu:_t13'});">inppane1</a></div></li><li class="mobi-list-item" id="menuForm:mnu:_t14" name="menuForm:mnu:_t14"><div class="mobi-list-item-default"><a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'inppane2',singleSubmit: true,selClientId: 'inppane2',client: false, item: 'menuForm:mnu:_t14'});">inppane2</a></div></li></ul></div></div></div><span><input id="menuForm:mnu_hidden" name="menuForm:mnu_hidden" type="hidden"></span></div>
        {code}

        The first item above is rendered as an <li> element outside of a <ul> list.
        When using a ContentStackMenu type accordion, if you have a contentMenuItem without a previous group header, the rendered markup is incorrect:

        Hide
        Philip Breau added a comment - - edited
        <div id="menuForm:mnu" name="menuForm:mnu">
            <div class="mobi-layoutmenu mobi-accordion" id="menuForm:mnu_acc">
                <li class="mobi-list-item" id="menuForm:mnu:_t7" name="menuForm:mnu:_t7">
                    <div class="mobi-list-item-default">
                        <a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'splash',singleSubmit: true,selClientId: 'splash',client: true, item: 'menuForm:mnu:_t7'});">splash</a>
                    </div>
                </li>
                <div class="closed" id="menuForm:mnu:_t8_sect">
                    <div class="handle ui-bar-b" id="menuForm:mnu:_t8_hndl" onclick="ice.mobi.accordionController.toggleMenu('menuForm:mnu',this);">
                        <span class="pointer"></span>navPanes
                    </div>
                    <div class="mobi-layoutmenu ">
                        <ul class="mobi-list ">
                            <li class="mobi-list-item" id="menuForm:mnu:_t9" name="menuForm:mnu:_t9">
                                <div class="mobi-list-item-default">
                                   <a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'navpane1',singleSubmit: true,selClientId: 'navpane1',client: true, item: 'menuForm:mnu:_t9'});">navpane1</a>
                                </div>
                            </li>
                            <li class="mobi-list-item" id="menuForm:mnu:_t10" name="menuForm:mnu:_t10"><div class="mobi-list-item-default"><a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'navpane2',singleSubmit: true,selClientId: 'navpane2',client: false, item: 'menuForm:mnu:_t10'});">navpane2</a></div></li><li class="mobi-list-item" id="menuForm:mnu:_t11" name="menuForm:mnu:_t11"><div class="mobi-list-item-default"><a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'navpane3',singleSubmit: true,selClientId: 'navpane3',client: false, item: 'menuForm:mnu:_t11'});">navpane3</a></div></li></ul></div></div><div class="closed" id="menuForm:mnu:_t12_sect"><div class="handle ui-bar-b" id="menuForm:mnu:_t12_hndl" onclick="ice.mobi.accordionController.toggleMenu('menuForm:mnu',this);"><span class="pointer"></span>input</div><div class="mobi-layoutmenu "><ul class="mobi-list "><li class="mobi-list-item" id="menuForm:mnu:_t13" name="menuForm:mnu:_t13"><div class="mobi-list-item-default"><a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'inppane1',singleSubmit: true,selClientId: 'inppane1',client: true, item: 'menuForm:mnu:_t13'});">inppane1</a></div></li><li class="mobi-list-item" id="menuForm:mnu:_t14" name="menuForm:mnu:_t14"><div class="mobi-list-item-default"><a class="ui-link-inherit" onclick="mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'inppane2',singleSubmit: true,selClientId: 'inppane2',client: false, item: 'menuForm:mnu:_t14'});">inppane2</a></div></li></ul></div></div></div><span><input id="menuForm:mnu_hidden" name="menuForm:mnu_hidden" type="hidden"></span></div>
        

        The first item above is rendered as an <li> element outside of a <ul> list.

        Show
        Philip Breau added a comment - - edited <div id= "menuForm:mnu" name= "menuForm:mnu" > <div class= "mobi-layoutmenu mobi-accordion" id= "menuForm:mnu_acc" > <li class= "mobi-list-item" id= "menuForm:mnu:_t7" name= "menuForm:mnu:_t7" > <div class= "mobi-list-item- default " > <a class= "ui-link-inherit" onclick= "mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'splash',singleSubmit: true ,selClientId: 'splash',client: true , item: 'menuForm:mnu:_t7'});" >splash</a> </div> </li> <div class= "closed" id= "menuForm:mnu:_t8_sect" > <div class= "handle ui-bar-b" id= "menuForm:mnu:_t8_hndl" onclick= "ice.mobi.accordionController.toggleMenu('menuForm:mnu', this );" > <span class= "pointer" ></span>navPanes </div> <div class= "mobi-layoutmenu " > <ul class= "mobi-list " > <li class= "mobi-list-item" id= "menuForm:mnu:_t9" name= "menuForm:mnu:_t9" > <div class= "mobi-list-item- default " > <a class= "ui-link-inherit" onclick= "mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'navpane1',singleSubmit: true ,selClientId: 'navpane1',client: true , item: 'menuForm:mnu:_t9'});" >navpane1</a> </div> </li> <li class= "mobi-list-item" id= "menuForm:mnu:_t10" name= "menuForm:mnu:_t10" ><div class= "mobi-list-item- default " ><a class= "ui-link-inherit" onclick= "mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'navpane2',singleSubmit: true ,selClientId: 'navpane2',client: false , item: 'menuForm:mnu:_t10'});" >navpane2</a></div></li><li class= "mobi-list-item" id= "menuForm:mnu:_t11" name= "menuForm:mnu:_t11" ><div class= "mobi-list-item- default " ><a class= "ui-link-inherit" onclick= "mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'navpane3',singleSubmit: true ,selClientId: 'navpane3',client: false , item: 'menuForm:mnu:_t11'});" >navpane3</a></div></li></ul></div></div><div class= "closed" id= "menuForm:mnu:_t12_sect" ><div class= "handle ui-bar-b" id= "menuForm:mnu:_t12_hndl" onclick= "ice.mobi.accordionController.toggleMenu('menuForm:mnu', this );" ><span class= "pointer" ></span>input</div><div class= "mobi-layoutmenu " ><ul class= "mobi-list " ><li class= "mobi-list-item" id= "menuForm:mnu:_t13" name= "menuForm:mnu:_t13" ><div class= "mobi-list-item- default " ><a class= "ui-link-inherit" onclick= "mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'inppane1',singleSubmit: true ,selClientId: 'inppane1',client: true , item: 'menuForm:mnu:_t13'});" >inppane1</a></div></li><li class= "mobi-list-item" id= "menuForm:mnu:_t14" name= "menuForm:mnu:_t14" ><div class= "mobi-list-item- default " ><a class= "ui-link-inherit" onclick= "mobi.layoutMenu.showContent('stack1', event,{ selectedId: 'inppane2',singleSubmit: true ,selClientId: 'inppane2',client: false , item: 'menuForm:mnu:_t14'});" >inppane2</a></div></li></ul></div></div></div><span><input id= "menuForm:mnu_hidden" name= "menuForm:mnu_hidden" type= "hidden" ></span></div> The first item above is rendered as an <li> element outside of a <ul> list.
        Hide
        Philip Breau added a comment -

        The ContentStackMenu is rendered by the individual contentMenuItems, which makes it very difficult to intelligently render items in different contexts. For instance, a non-header contentMenuItem that does not follow a header-type contentMenuItem has to know whether to render the surrounding <ul> element.

        Show
        Philip Breau added a comment - The ContentStackMenu is rendered by the individual contentMenuItems, which makes it very difficult to intelligently render items in different contexts. For instance, a non-header contentMenuItem that does not follow a header-type contentMenuItem has to know whether to render the surrounding <ul> element.
        Hide
        Philip Breau added a comment - - edited
        Show
        Philip Breau added a comment - - edited See http://labs.icesoft.com/mobitest/layout/contentStackMenu/accordionMenu.jsf for an example of the bug.
        Philip Breau made changes -
        Status Open [ 1 ] Closed [ 6 ]
        Resolution Won't Fix [ 2 ]

          People

          • Assignee:
            Philip Breau
            Reporter:
            Philip Breau
          • Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved: