JQuery UI аккордеон при инициализации при последующих вызовах после первого - PullRequest
Новая
       1

JQuery UI аккордеон при инициализации при последующих вызовах после первого

0 голосов
/ 25 мая 2011

Шаг 1. Загрузите веб-страницу с помощью div "foo" и шаблона jqote2 "tmpl_foo" (jqote2 - это система шаблонов на основе jQuery). 

<div id="foo"></div>

<script type="text/x-jqote-template" id="tmpl_foo">
    <![CDATA[
    <% for (i in this.bar) { %>
            <h3><%= this.bar[i].title %></h3>
            <div class="pane"><%= this.bar[i].desc %></div>
    <% } %>
    ]]>
</script>

Шаг 2. Запустите ajax-запрос через jQuery для получения данных с сервера, заполните div "foo" с помощью jqote2 и запустите аккордеон пользовательского интерфейса jQuery на "foo". 

var get_foo : function () {
    $.ajax({
        url     : url,
        type    : "GET",
        data    : "",
        dataType: "json",
        error   : function() { alert("Error loading html document"); },
        success : function(res) {
            $("#foo").empty().append(
                $('#tmpl_foo').jqote({
                'bar': res.bar
                }) 
            ).accordion();
        }
    });
}

$(document).ready(function() {
    get_foo();
});

Работает прекрасно.

На веб-странице у меня также есть другие ссылки, такие как «предыдущая страница» и «следующая страница» (стандартные функции пейджера), которые также запускают get_foo(). Эти действия также приводят к правильному получению новых данных, и новые результаты также правильно вставляются в «foo». Однако по какой-то причине аккордеон не инициализируется. Я в тупике. В чем может быть причина?

1 Ответ

1 голос
/ 25 мая 2011

Сначала нужно сбросить гармошку: 

        $("#foo").empty().append(
            $('#tmpl_foo').jqote({
            'bar': res.bar
            }) 
        ).accordion('destroy').accordion();

Вам может понадобиться рассчитать текущий элемент аккордеона, если вы хотите сохранить это состояние.

...