Ticket #823 (new defect)
Accordion addSection Method doesn't allow insertion into last position
| Reported by: | VirtuosiMedia | Owned by: | |
|---|---|---|---|
| Type: | defect | Priority: | major |
| Milestone: | Mootools version 1.2 | Component: | Plugins |
| Keywords: | Accordion addSection | Cc: |
Description
The addSection Method for the Accordion class does not allow insertion of a new section into the last position of the array. In an array of 2 , [0, 1], either 0 or 1 may be passed as arguments to add a third section, but not 2. If no argument is passed, the new section defaults to the second to last position rather than the last. I was able to fix this in v1.11 by changing:
if (len && (!test || pos)){
pos = $pick(pos, len - 1);
toggler.injectBefore(this.togglers[pos]);
element.injectAfter(toggler);
} else if (this.container && !test){
toggler.inject(this.container);
element.inject(this.container);
}
to:
if (len && (!test || pos)){
pos = $pick(pos, len - 1);
toggler.injectAfter(this.elements[pos]);
element.injectAfter(toggler);
} else if (this.container && !test){
toggler.inject(this.container);
element.inject(this.container);
}
However, simply changing 'before' to 'after' in version 1.2b2 does not work. Here is an example of my code:
<script type="text/javascript">
window.addEvent('domready', function() {
var menu = new Accordion('.toggle', '.element', {
display: 1,
fixedHeight: 300,
alwaysHide: true,
duration: 2500,
onActive: function(toggler, element){
toggler.setStyle('color', '#CCC');
},
onBackground: function(toggler, element){
toggler.setStyle('color', '#000');
}
}
);
var thirdMenuToggler = new Element('div', {'class': 'toggle'}).setHTML('Menu 3');
var thirdMenuElement = new Element('div', {'class': 'element'}).setHTML('<ul><li><a href=“#”>Link 6</a></li><li><a href=“#”>Link 7</a></li></ul>');
menu.addSection(thirdMenuToggler, thirdMenuElement);
});
</script>
<div id="menu">
<div class="toggle">Menu 1</div>
<div class="element">
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
</ul>
</div>
<div class="toggle">Menu 2</div>
<div class="element">
<ul>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
<li><a href="#">Link 5</a></li>
</ul>
</div>
</div>
Change History
Note: See
TracTickets for help on using
tickets.