[MOBI-909] ContentStackMenu type accordion does not correctly render items without group headers - ICEsoft JIRA Issue Tracker

Details

Type: Bug
Status: Closed
Priority: 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

Ascending order - Click to sort in descending order

Philip Breau created issue - 04/Oct/13 6:29 AM

Philip Breau made changes - 04/Oct/13 6:30 AM

Field	Original Value	New Value
Assignee	Steve Maryka [ steve.maryka ]	Philip Breau [ philip.breau ]

Philip Breau made changes - 04/Oct/13 6:30 AM

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

Permalink

Philip Breau added a comment - 04/Oct/13 6:30 AM - 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 - 04/Oct/13 6:30 AM - 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

Permalink

Philip Breau added a comment - 04/Oct/13 6:45 AM

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 - 04/Oct/13 6:45 AM 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

Permalink

Philip Breau added a comment - 04/Oct/13 7:30 AM - edited

See http://labs.icesoft.com/mobitest/layout/contentStackMenu/accordionMenu.jsf for an example of the bug.

Show

Philip Breau added a comment - 04/Oct/13 7:30 AM - edited See http://labs.icesoft.com/mobitest/layout/contentStackMenu/accordionMenu.jsf for an example of the bug.

Philip Breau made changes - 06/Jan/16 2:45 PM

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:

04/Oct/13 6:29 AM

Updated:

06/Jan/16 2:45 PM

Resolved:

06/Jan/16 2:45 PM