JQuery аккордеон, который не открывается после перетаскивания - PullRequest
Новая
       11

JQuery аккордеон, который не открывается после перетаскивания

1 голос
/ 23 апреля 2011

У меня есть следующие логические блоки HTML:

  • Первый - это список сортируемых аккордеонов
  • Второй - список перетаскиваемых аккордеонов.Эти элементы могут быть добавлены в сортируемые аккордеоны.

Демонстрация здесь: http://jsfiddle.net/t3tVA/

Поэтому я хотел бы переместить мои перетаскиваемые элементы, чтобы добавить их в сортируемые аккордеоны.Он работает нормально, за исключением того, что когда мой элемент отбрасывается среди сортируемых аккордеонов, его нельзя открыть.

Вот мой код JavaScript: 

$(function() {
$( "> div", "#questionsDispos" ).draggable({
    helper: "clone",
    revert: "invalid",
    cursor: "move",
    handle: "h3",
    connectToSortable: ".questions"
});

$( ".questions" ).accordion({
    header: "> div > h3",
    collapsible: true,
    active: false,
    autoHeight: false
}).sortable({
    handle: "h3",
    receive: function(event, ui) {
        $(ui.item).removeClass();
        $(ui.item).removeAttr("style");
    }
});

$( "#questionsDispos" ).accordion({
    header: "> div > h3",
    collapsible: true,
    active: false,
    autoHeight: false
});
});

А вот мой HTML: 

<div class="questions">
    <div>
        <h3><a href="#">Question 1. My First Question ?</a></h3>
        <div>
            First content<br />
        </div>
    </div>

    <div>
        <h3><a href="#">Question 2. My Second Question ?</a></h3>
        <div>
            Second content<br />
        </div>
    </div>

    <div>
        <h3><a href="#">Question 3. My Third Question ?</a></h3>
        <div>
            Third content<br />
        </div>
    </div>
</div>

Questions disponibles :<br />
<div id="questionsDispos">
    <div>
        <h3><a href="#">Something</a></h3>
        <div>
            My Content Here<br />
        </div>
    </div>
</div>

Обратите внимание, что я использую исправленную версию jquery-ui-1.8.11.custom.min.patch.js, чтобы использовать ui.item в событии приема sortable.(Я использую его для удаления некоторых классов, чтобы сделать перемещенный элемент похожим на другие).Вы можете скачать его здесь: http://www.toofiles.com/fr/oip/documents/js/jquery-ui-1811customminpatch.html

РЕДАКТИРОВАТЬ: я разместил здесь демо, чтобы вы могли проверить его: http://jsfiddle.net/t3tVA/ Как вы можете видеть, когда вы бросаете "Something" среди аккордеонов насверху не открывается больше

У кого-нибудь есть решение?Спасибо

1 Ответ

1 голос
/ 23 апреля 2011

Согласно этой ошибке, это не то, что вы можете сделать прямо из коробки.Однако, если вы посмотрите на отчет об ошибке, кто-то предоставил решение, добавив дополнительную опцию autoActive в кодовую базу.

Альтернативой является уничтожение аккордеона и его восстановление после того, как элемент был сброшен в вашем аккордеоне.Рабочий образец:

http://jsfiddle.net/t3tVA/1/

...