Динамическое диалоговое окно jQuery после добавления данных без перезагрузки страницы. Возможный?

Question

Итак, у меня есть страница с огромной таблицей в виде интерфейса CRUD. Каждая ссылка в промежутке вызывает диалоговую форму jQuery UI, которая извлекает ее содержимое с другой страницы. Когда выполняемое действие (в данном случае создание) завершается, он добавляет полученные новые данные в таблицу и вызывает обращение к таблице. Все это происходит в JS и DOM.

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

Код выглядит следующим образом:

$(document).ready(function() {
    var $loading = $('<img src="/images/loading.gif" alt="Loading">');
    $('span a').each(function() {
        var $dialog = $('<div></div>')
            .append($loading.clone());

        var $link = $(this).one('click', function() {
            // Dialog Stuff
            success: function(data) {
                $('#studies tbody').append(
                    '<tr>' +
                        '<td><span><a href="./?action=update&study=' + data.study_id + '" title="Update Study">Update</a></span></td>' +
                    '</tr>'
                );
                fdTableSort.init(#studies); // This re-sorts the table.
                $(this).dialog('close');
            }
            $link.click(function() {
                $dialog.dialog('open');
                return false;
            });

            return false;
        });
    });
});

По сути, мой вопрос заключается в том, есть ли способ инициировать повторную оценку jQuery ссылок на страницы, не заставляя меня обновлять страницу в браузере?

Answer 1

Попробуйте связать вновь созданную ссылку с помощью функции jquery live .

Answer 2

Если я правильно понимаю, я думаю, что вы можете немного изменить код, чтобы он работал для вас:

$(document).ready(function() {
  var $loading = $('<img src="/images/loading.gif" alt="Loading">');
  $('span a').click(function() { //changed here
    var $dialog = $('<div></div>')
        .append($loading.clone());

    //rest of your code  
}

}

Таким образом, ваш диалог создается полностью динамическии добавляется к вашей DOM по событию click для элементов span a.

Другой вопрос, который вам нужно задать, - если диалоговое окно является плавающим div (что вероятно), обновление страницы, вероятно, приведет к диалогу.не появляется после того, как страница обслуживается.То есть вы не хотите и не можете позволить себе обновить страницу.