Флажок при изменении не работает в частичных представлениях, отображаемых через AJAX

У меня есть страница, разработанная с использованием С# MVC3 и частичных представлений. Разбивка на страницы реализована с использованием частичного представления и AJAX. Сгенерированная страница будет иметь флажок для каждой записи. Идея состоит в том, чтобы позволить пользователю установить флажок рядом с каждой записью, которую он хочет напечатать. Когда они нажимают кнопку «Печать», которая находится на странице, будут распечатаны только выбранные записи. Для этого я перемещаю выбранную запись в <div>, которая находится на странице макета, и по нажатию кнопки печати я использую эти скопированные записи для печати.

I have one    layaout page : _layout.cshtml    
                     View  :  DetailedReport.cshtml
            Partical View  :  `PVdetailedReport.cshtml`

DetailedReport.cshtml и PVdetailedReport.cshtml абсолютно одинаковы.

В самый первый раз (т.е. для страницы 1) я использую DetailedReport.cshtml. Для остальных страниц, поскольку они отображаются с помощью вызовов ajax, я использую PVdetailedReport.cshtml.

Перемещение выбранных элементов в <div>, когда я устанавливаю флажок, отлично работает для первой страницы, но на последующих страницах, которые отображаются с помощью AJAX и частичного просмотра, перемещение выбранного элемента не работает.

Вот код для перемещения выбранных элементов в <div>

  $(":checkbox").on('change', function () {
       if ($(this).hasClass('containerToCopy')) {

            if ($(this).is(':checked')) {
                // If a listing is selected then move it to  divToPrintContainer, which is buried inside _Layout.cshtml
                $(this).closest('table').clone().appendTo("#divToPrintContainer");
               } else {
                // If a listing is UNselected then remove it from  divToPrintContainer
                $('#divToPrintContainer').find("[id='" + "tbl-" + $(this).attr('id') + "']").remove();
            }
    }
});

person BumbleBee    schedule 23.07.2013    source источник


Ответы (1)


Попробуйте делегировать прослушиватель событий

$(document).on('change', ":checkbox", function () { ... });

Дополнительные сведения см. на странице http://api.jquery.com/on/.

person user2602681    schedule 23.07.2013