Сделать новую вкладку действующей как статическая

Question

Сделать новую вкладку действующей как статическая

0

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

Все пункты меню разделяются между вкладками и перетаскиваются. Также их можно перетащить в другую вкладку, используя jquery ui # connect-lists-through-tabs. Я хочу добавить возможность создания новой вкладки, что возможно с тем же jquery ui. Но, не имеет значения, что я добавляю в новую вкладку, он не делится другими вкладками.

Вот функция addTab:

function addTab() {
    var label = tabTitle.val() || "Tab " + tabCounter, id = "tabs-"
            + tabCounter, li = $(tabTemplate.replace(/#\{href\}/g,
            "#" + id).replace(/#\{label\}/g, label));
    tabs.find(".ui-tabs-nav").append(li);
    tabs
            .append("<div id='" + id + "'>"
                    + "<ul id='sortable1' class='connectedSortable ui-helper-reset'><li class='ui-state-default'>Im an menu item</li><div class='dragme'>...</div></ul>"
                    + "</div>");
    tabs.tabs("refresh");
    tabCounter++;
}

Я создаю новую вкладку с div в ней, которая содержит класс <ul>, который должен быть сортируемым и так далее, но это не так.

Добавление новых <li> элементов по коду в статические вкладки отлично работает.

Может быть, у кого-нибудь есть идея, как я могу решить эту проблему? Спасибо за помощь.

Narkolepsia 01 окт. 2013, в 15:57

Источник

Теги:

jquery

html

jquery-ui

tabs

1 ответ

Ещё вопросы

Getu.ch · Accepted Answer · 2013-10-01T12-34-00.000Z

чтобы включить функцию перетаскивания в jquery, вам необходимо ее инициализировать. что вы можете сделать после загрузки страницы.

поэтому, когда вы добавляете вкладку в свое меню, вам также нужно инициализировать функцию перетаскивания для этого нового элемента.

просто запустите функцию перетаскивания с начала, и она должна работать.

или вы используете эту функцию addtab:

function addTab() {
var label = tabTitle.val() || "Tab " + tabCounter, id = "tabs-"
        + tabCounter, li = $(tabTemplate.replace(/#\{href\}/g,
        "#" + id).replace(/#\{label\}/g, label));
tabs.find(".ui-tabs-nav").append(li);
tabs
        .append("<div id='" + id + "'>"
                + "<ul id='sortable1' class='connectedSortable ui-helper-reset'><li class='ui-state-default'>Im an menu item</li><div class='dragme'>...</div></ul>"
                + "</div>");
tabs.tabs("refresh");

$('#' + id).draggable();
tabCounter++;

}

указанную конфигурацию для перетаскивания можно найти здесь.