Не могу повесить Событие onchange на элементы созданные динамически после Ajax запроса.
jQuery скрипт на фронтенде обращается к серверу, он отправляет туда запрос с двумя параметрами: lines - количество записей на странице, pages - номер страницы. Сервер возвращает ответ в виде JSON массива в котором первый элемент указывает количество страниц: { "pages":87 }, а все остальные элементы - это записи которые будут выводится на данной странице.
Количество страниц нужно для создания постраничной навигации на jQuery, зная число страниц, после Ajax ответа я динамически формирую ul список с номерами страниц.
Пользователь выбирает номер, после чего к серверу идет новый Ajax запрос.
Пользователь может менять число записей на странице
Когда на сервер отправляется новое число записей в параметре line, в ответ приходит новое значение pages - количества страниц. Но здесь и возникла основная проблема, список выбора количества станиц у меня работает на событие onchange, и когда хочу чтобы он сделал новый запрос на сервер при клике на список , события не появляется! Не могу понять как можно его запустить?
Пример возвращаемого JSON:
[ { "pages":87 }, // первый элемент с количеством страниц {
"feedback_id":"1", "name":"john", "feedback":"my 1st comment", "feedback_date":"2014-12-16 09:36:29", "pages":"0" }, { "feedback_id":"2", "name":"caty", "feedback":"something to write about", "feedback_date":"2014-12-16 09:36:29", "pages":"0" }, ]
Возможно проблема в том, что я запускаю все через функцию?
Подключение:
$(document).ready(function(){ var pageData = {}; // данные для постраничной навигации
NumberResources(pageData); // выводим список
});
А вот код самой функции:
function NumberResources(pageData){
//...
$.ajax({
url: "database-test.php",
type:"GET",
data: {"lines": pageData['records_per_page'], "pages": pageData['current_page']},
dataType: 'json',
success: function(response) {
var pages; // количество ВСЕХ страниц
var output; // строки выводимые на странице
var i = 0;
$.each(response, function(key, val) { // обходим массив записей
if(key!=0){
// вывод записей ....
}else {
// получаем число ВСЕХ страниц
pageData['total_pages'] = Number(val.pages);
}
});
PageNavigation(pageData); // вызов постраничной навигации
$('#update').prepend(output); // выводим в таблицу строки из базы
//...
// ВЫБИРАЕМ ЧИСЛО СТРАНИЦ
$('select').on('change', function () {
$('select option:selected').each(function() {
$('#update').empty();
var pageData = {};
pageData['current_page'] = parseInt($('li.active .number').text());
records_per_page = $(this).val();
$('#records_per_page').empty();
$('#records_per_page').prepend(records_per_page);
NumberResources(pageData); // рекурсивно обращаюсь к функции с Ajax запросом
});
}
});
}