Mootools: Как добавить элементы в существующий экземпляр Fx.Sort
У меня проблема с Mootools Fx.Sort.
<ul id="list">
<li>One</li>
<li>Two</li>
</ul>
Javascript:
mySort = new Fx.Sort($$('ul#list>li'));
Я могу добавить больше элементов в список:
$('list').adopt(new Element('li', { text: 'Three' }));
Но созданные во время выполнения элементы списка, очевидно, не учитываются экземпляром Fx.Sort и не могут быть отсортированы вместе с другими.
Есть ли способ добавить их в существующую сортировку Fx.Sort? Или единственное, что нужно заменить mySort
с новым экземпляром каждый раз, когда я добавляю элемент во время выполнения?
2 ответа
Правильно - сложнее поддерживать его совместимость с реализациями Fx.Sort и сортировать его, как следует и т. д., вот рабочий пример, когда любой из элементов, по которым щелкают, переходит в начало, а затем расширяется:
http://jsfiddle.net/dimitar/FcN32/
специфично для вас:
Fx.Sort.implement({
adopt: function(el, pos) {
if (!this.element)
this.element = this.elements[0] && this.elements[0].getParent();
var len = this.currentOrder.length;
pos = (pos !== null && typeof pos === 'number')
? this.currentOrder.contains(pos) ? pos : len
: len;
this.elements.include(el);
if (pos === len) {
// don't care, attach to bottom.
el.inject(this.element);
this.currentOrder.push(this.elements.indexOf(el));
}
else {
// we are injecting at a particular place in the order
el.inject(this.elements[pos], "before");
var newOrder = this.currentOrder.slice(0, pos) || [];
newOrder.push(this.elements.indexOf(el));
this.currentOrder = newOrder.combine(this.currentOrder.slice(pos));
}
if (el.getStyle('position') == 'static') el.setStyle('position', 'relative');
this.rearrangeDOM();
}
});
это называется как instance.adopt(someel, <optional pos>)
где pos - это числовая позиция в списке. если опущен, он добавится к хвосту. Надеюсь, поможет...
Взглянув на Fx.Sort
Например, есть некоторые атрибуты, которые вы можете изменить в соответствии со своими потребностями:
console.log(new Fx.Sort($$('ul#list>li'));
Вот как бы я это сделал (не проверял):
var mySort = new Fx.Sort($$('ul#list>li'));
var newElement = new Element('li', { text: 'Three' });
$('list').adopt(newElement);
mySort.elements.include(newElement);
mySort.subjects.include(newElement);
// Order of elements
var orderSize = mySort.currentOrder.length;
mySort.currentOrder[orderSize] = orderSize;
Тем не менее, он изменяет внутренний механизм Mootools More FX.Sort, поэтому он может не работать.