Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.06.2021, 11:57
Аватар для mav1
Аспирант
Отправить личное сообщение для mav1 Посмотреть профиль Найти все сообщения от mav1
 
Регистрация: 30.08.2010
Сообщений: 57

Как запустить js/jquery функцию после того, как содержимое страницы обновлено ajax-ом
Доброго времени суток.



У меня есть страница с таблицей с постраничной навигацией. Навигация по страницам происходит с помощью ajax - когда я кликаю по номеру страницы, запускается функция LoadContent(), которая обновляет содержимое страницы. Также я использую кое-какой jquery скрипт для того, чтобы модифицировать содержимое таблицы после того, как она загружена:

function addNamesAttr() {
        $('.MyTable tr)').each(function () { 
   $(this).attr('name', ''); // добавляет пустой атрибут name для каждой строки
});
        console.log('names are applied');
    }
    
    
    $( document ).ready(function() {
        addNames();
});

Проблема в том, что эта функция addNamesAttr() срабатывает только на первой странице, то есть до перехода по навигационным ссылкам. Когда я переходу на вторую страниц и далее, функция не срабатывает. Наверное, можно было бы вставить addNamesAttr() внутрь LoadContent() (после ajax события), но я не могу это сделать так как нет возможности изменить содержимое LoadContent() по причине того, что это встроенная функция в генератор кода, который я вынужден использовать для этого сайта (это scriptcase).

Я пытался запускать addNamesAttr() при клике по ссылкам навигации 2/3/... (у этих ссылок есть класс ".PageLink"), с помощью этого кода:

$( document ).ready(function() {
        $('.PageLinkClass').on('click', function() { 
            addNames();
        });
        });


но это не решает задачу, так как она запускается до того, как ajax-обновление страницы полностью выполнено. Так как же заставить addNamesAttr() запускаться на всех страницах?
Ответить с цитированием
  #2 (permalink)  
Старый 23.06.2021, 13:04
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,078

mav1,
так в конец LoadContent и добавляйте свою функцию
Ответить с цитированием
  #3 (permalink)  
Старый 23.06.2021, 15:01
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,135

Сообщение от mav1
Навигация по страницам происходит с помощью ajax - когда я кликаю по номеру страницы, запускается функция LoadContent(), которая обновляет содержимое страницы.
Вообще все заменяется на странице или только содержимое какого-то элемента?

Последний раз редактировалось ksa, 23.06.2021 в 15:18.
Ответить с цитированием
  #4 (permalink)  
Старый 23.06.2021, 15:20
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,135

mav1, вот пример эмулирующий загрузку данных с сервера и пример отслеживания того момента "когда элемент изменился"...

<div id='page'></div>
<button>Обновить</button>

<script>
const o = document.getElementById('page')
o.addEventListener('DOMSubtreeModified', function(){
	alert('Содержимое изменилось!')
})
document.querySelector('button').addEventListener('click', function(){
	page()
})
page()
function page() {
	setTimeout(() => {
		o.innerHTML = new Date().toString()
	}, 1000)
}
</script>
Ответить с цитированием
  #5 (permalink)  
Старый 23.06.2021, 16:23
Аватар для mav1
Аспирант
Отправить личное сообщение для mav1 Посмотреть профиль Найти все сообщения от mav1
 
Регистрация: 30.08.2010
Сообщений: 57

Сообщение от рони Посмотреть сообщение
mav1,
так в конец LoadContent и добавляйте свою функцию
не могу модифицировать LoadContent(), по причине, указанной в первом сообщении, увы
Ответить с цитированием
  #6 (permalink)  
Старый 26.06.2021, 11:13
Профессор
Отправить личное сообщение для Vaska Посмотреть профиль Найти все сообщения от Vaska
 
Регистрация: 08.05.2017
Сообщений: 178

mav1,
попробуйте внутрь положить ваш код:
$(document).on('DOMNodeInserted', '#scrollable', function() {
    ....
});

id="scrollable" поместите в тот блок, который хотите обновлять после подгрузки аякса.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как показать текст после того как его скрыли? maxim1978 Элементы интерфейса 4 30.05.2021 15:45
Решение проблемы кодировок для AJAX и PHP без iconv (cp1251 в AJAX) Serge Ageyev AJAX и COMET 10 24.04.2013 20:48
Как запустить функцию при отображении элемента в окне браузера? Kostushko Events/DOM/Window 6 27.09.2010 11:03
Как запустить скрипт после отработки другого скрипта? roman2 Общие вопросы Javascript 2 10.08.2009 01:23
js файл(незнаю как запустить функцию) Temchik Opera, Safari и др. 6 20.07.2009 11:49