Как правильно отправить данные к нескольким div из js

@Eclipse19 · Регистрация: 04.03.2023

Студворк — интернет-сервис помощи студентам

Не могу никак доработать вывод трёх пагинаций на одну страницу. Дело в том, что все три они корректно выводятся и вставляются в свои блоки, а вот если мне нужно вставить только 2ую пагинацию из 3х, то она вставляется по умолчанию в 1ый ul когда надо во 2ой. Это нужно для ajax. Вот html:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php
$result = R::getAll("SELECT * FROM menu ORDER BY id");
 
foreach ($result as $row) {
  $cat[] = "<input name='news_cat' type='hidden' value='".$row["id"]."' />".$row["name"]."<br/>";
}
?>
 
<div class="hs-categ"><?= $cat[0] ?>
   <ul class="pagcat">
 
   </ul>
</div>
<div class="hs-categ"><?= $cat[1] ?>
   <ul class="pagcat">
 
   </ul>
</div>
<div class="hs-categ"><?= $cat[2] ?>
   <ul class="pagcat">
 
   </ul>
</div>

А вот данные, которые передаются через ajax

PHP
1
2
3
4
5
6
7
8
9
10
11
12
Array
(
    [0] => 3
)
Array
(
    [0] => 2
)
Array
(
    [0] => 2
)

Изначальный вариант js, когда выводятся пагинации все сразу

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
success: function (response) {
const { output } = JSON.parse(response);
$('.hs-categ').each(function (i) {
    //вывод из бд номеров пагинаций
        var pagcat = $(this).find('.pagcat');
        output[i].forEach(function (page) //перебор и вывод списка пагинаций
        {
            const pag = getItemPAG(page);
            pagcat.empty().append(pag); //очищаем старую и добавляем новую выборку статей и пагинаций
        });
});
 
function getItemPAG(page)
{
    const pagHTML = `
        <div id="pagelink">${page}</div>`;
 
    return pagHTML;
}

Нерабочий вариант. В этом js я пытался передать значение только в второй блок .pagcat через метод eq(), но что-то не получилось.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
success: function (response) {
const { output } = JSON.parse(response);
$('.hs-categ').each(function (i) {
    //вывод из бд номеров пагинаций
        var arr = [1];
        var pagcat = $(this).find('.pagcat');
        output[i].forEach(arr, function (page, e) //перебор и вывод списка пагинаций
        {
            const pag = getItemPAG(page);
            pagcat.empty().eq(e).append(pag); //очищаем старую и добавляем новую выборку статей и пагинаций
        });
});
 
function getItemPAG(page)
{
    const pagHTML = `
        <div id="pagelink">${page}</div>`;
 
    return pagHTML;
}

@pincet · 01.08.2023, 10:31

dataset для ul не предлагать?

@Eclipse19 · 01.08.2023, 14:33 **[ТС]**

pincet, если это решит мою проблему, то почему бы и нет. Тогда придется вручную присваивать номер каждому новому блоку ul?

@pincet · 01.08.2023, 15:13

а как еще различить твои дивы/улы?

@Eclipse19 · 01.08.2023, 15:33 **[ТС]**

pincet, не знаю. Я пробовал метод .eq()

@pincet · 01.08.2023, 15:54

Сообщение от Eclipse19

Я пробовал метод .eq()

ну, с jQuery не помогу. но решение даже на уровне концепта реально попахивает

Добавлено через 53 секунды
на пыхе заготовил что-то, помечтал и решил, что все будет работать на фронте

@klyapa · 01.08.2023, 21:50

Сообщение от Eclipse19

А вот данные, которые передаются через ajax

PHP
1
2
3
4
5
6
7
8
9
10
11
12
Array
(
    [0] => 3
)
Array
(
    [0] => 2
)
Array
(
    [0] => 2
)

....

JavaScript
1
const { output } = JSON.parse(response);

А что это за данные такие корявые? У вас что, в переменной output вложенный массив просто с одним числом в массиве?

JavaScript
1
[[3], [2], [2]] // так что ли? ... и что это за цифры? что они означают?

Зачем вы всё это в цикле перебираете, когда есть естественная нумерация (индексы в массиве/коллекции элементов) и ~~можно~~ нужно просто достать элемент по индексу и сунуть в него вот эту строку `<div id="pagelink">${page}</div>`, которую вы зачем-то в ненужную функцию завернули.

@Eclipse19 · 02.08.2023, 09:54 **[ТС]**

klyapa, например цифра 3 это образное значение, которое передает одну пагинацию целиком. Я временно убрал обработку этой цифры в php, поэтому и получается что передается просто цифра. Если цифра 3 будет обрабатываться, то вместо неё передадутся целые блоки div для пагинации. Не стоит на этом заострять внимание. Я наверное зря добавил это в пример и тем самым ввел в заблуждение. Я получаю нумерацию блоков из html и передаю в js где теперь этот номер блока хранится в переменной. Теперь сама проблема: я пытаюсь эту переменную передать в var arr = [1]; или var arr = [2]; или var arr = [3]; чтобы цикл как-то понял в какой по счету ul передавать одну пагинацию(почему в цикле всего одно значение крутится? так надо

).
Вот как я получаю переменную:

JavaScript
1
let tagsArray = $(this).closest('.hs-categ').find('input[name="news_cat"]').val();

три одинаковых и уже пронумерованных в .val 'input[name="news_cat"] распределены по блокам <ul class="pagcat">

@pincet · 02.08.2023, 15:06

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

@Eclipse19 · 03.08.2023, 10:27 **[ТС]**

pincet, не понимаю о чем вы

@Eclipse19 · 03.08.2023, 11:12 **[ТС]**

Есть некий цикл, в котором крутится три значения из output

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
const { output } = JSON.parse(response);
$('.hs-categ').each(function (i) {
        var pagcat = $(this).find('.pagcat');
        output[i].forEach(function (page) //перебор и вывод
        {
            const pag = getItemPAG(page);
            pagcat.empty().append(pag); //очищаем старую и добавляем новую выборку
        });
});
 
function getItemPAG(page)
{
    const pagHTML = `
        <div id="pagelink">${page}</div>`;
 
    return pagHTML;
}

Затем эти три значения отравляются в ul

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div class="hs-categ"><?= $cat[0] ?>
   <ul class="pagcat">
 
   </ul>
</div>
<div class="hs-categ"><?= $cat[1] ?>
   <ul class="pagcat">
 
   </ul>
</div>
<div class="hs-categ"><?= $cat[2] ?>
   <ul class="pagcat">
 
   </ul>
</div>

Проблема в том, что когда я хочу с помощью ajax прогнать по этому же циклу одно значение и отправить например в третий по счету блок, то это значение попадает в первый блок. Я пытался доработать цикл и с помощью переменной var arr = 3; (число будет меняться мной в зависимости от нумерации блока ul) дать понять циклу в какой блок вывести единственное значение output, которое там крутится.

JavaScript
1
2
3
4
5
6
7
8
9
$('.hs-categ').each(function (i) {
        var arr = 3;
        var pagcat = $(this).find('.pagcat');
        output[i].forEach(arr, function (page, e) //перебор и вывод
        {
            const pag = getItemPAG(page);
            pagcat.empty().eq(e).append(pag); //очищаем старую и добавляем новую выборку
        });
});

Как можно вывести единственное значение из цикла в блок так, чтобы значение попадало в ul, нумерацию которого я укажу в var arr = 3;?

@pincet · 03.08.2023, 12:27

Eclipse19,
я о том, что это реально похоже на `товарищи ученые, у меня в подвале раздаются странные звуки`
чего сразу не сделать нормально, а не фантазировать?

@Eclipse19 · 03.08.2023, 12:59 **[ТС]**

pincet, бывает не так то и просто донести суть проблемы

@pincet · 03.08.2023, 14:47

Сообщение от Eclipse19

бывает не так то и просто донести суть проблемы

именно по этому я и упомянул граждан ученых
что мешает на стороне сервера (уж если не в терпеж) пронумеровать каждый див используя dataset?

krvsa · 03.08.2023, 15:46

Не по теме:

Сообщение от Eclipse19

бывает не так то и просто донести суть проблемы

Значит ты творишь какую-то необъяснимую дичь...

@Eclipse19 · 04.08.2023, 10:39 **[ТС]**

klyapa, krvsa, pincet, ничего не дичь, просто сложный механизм вывода данных
В результате проб и ошибок получилось, что таким образом удается выводить нужную пагинацию в нужный блок:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
const { output } = JSON.parse(response); // в output выводится одно значение из трех
    var arr = [1];
    $.each(arr, function(a,e){
        $('.hs-categ').eq(e).each(function (i) {
            var pagcat = $(this).find('.pagcat');
            output[i].forEach(page =>
            {
                const pag = getItemPAG(page);
                pagcat.empty().append(pag);
            });
        });
    });

Однако, если я теперь хочу вывести из output все 3 пагинации в свои ul, то выводится только первая из них во все ul, которые я укажу в переменной var arr = [0,1,2]; Не понимаю почему так. Помогите пожалуйста решить эту проблему и тогда задача будет полностью решена

@pincet · 04.08.2023, 10:48

Сообщение от Eclipse19

ничего не дичь, просто сложный механизм вывода данных

тебе уже не первый раз говорят - скажи, что реально хочешь сделать
ибо нет ТЗ - результат ХЗ

@Eclipse19 · 04.08.2023, 10:52 **[ТС]**

Сообщение от pincet

именно по этому я и упомянул граждан ученых
что мешает на стороне сервера (уж если не в терпеж) пронумеровать каждый див используя dataset?

а смысл мне их указывать если я и так получаю их значения и уже передаю в переменную js, которая затем будет передавать значения сюда var arr = [0,1,2];

@pincet · 04.08.2023, 10:54

и перестань баловаться с var

Сообщение от Eclipse19

pagcat.empty()

JavaScript
1
pagcat.empty().append(pag);

не смущает?

@Eclipse19 · 04.08.2023, 10:54 **[ТС]**

Сообщение от pincet

тебе уже не первый раз говорят - скажи, что реально хочешь сделать
ибо нет ТЗ - результат ХЗ

дак я уже 100 раз объяснил вдоль и поперек чего хочу. Я же не могу вам вложить это в голову

Новые блоги и статьи Все статьи Все блоги /
PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Access VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .	Ломающие изменения в C#.NStar Alpha Etyuhibosecyu 20.11.2025 Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .	Мысли в слух kumehtar 18.11.2025 Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .	Создание Single Page Application на фреймах krapotkin 16.11.2025 Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .

@pincet 1654 / 1153 / 173 Регистрация: 23.07.2010 Сообщений: 6,910
	01.08.2023, 10:31
	dataset для ul не предлагать? 0

@Eclipse19 1 / 1 / 0 Регистрация: 04.03.2023 Сообщений: 129
	01.08.2023, 14:33 [ТС]
	pincet, если это решит мою проблему, то почему бы и нет. Тогда придется вручную присваивать номер каждому новому блоку ul? 0

@pincet 1654 / 1153 / 173 Регистрация: 23.07.2010 Сообщений: 6,910
	01.08.2023, 15:13
	а как еще различить твои дивы/улы? 0

@Eclipse19 1 / 1 / 0 Регистрация: 04.03.2023 Сообщений: 129
	01.08.2023, 15:33 [ТС]
	pincet, не знаю. Я пробовал метод .eq() 0

@pincet 1654 / 1153 / 173 Регистрация: 23.07.2010 Сообщений: 6,910
	02.08.2023, 15:06
	Eclipse19, кто на ком стоял? можно реальную картину мира прямо вот здесь выложить? что мечталось, что сделалось, что в итоге? 0

@Eclipse19 1 / 1 / 0 Регистрация: 04.03.2023 Сообщений: 129
	03.08.2023, 10:27 [ТС]
	pincet, не понимаю о чем вы 0

@pincet 1654 / 1153 / 173 Регистрация: 23.07.2010 Сообщений: 6,910
	03.08.2023, 12:27
	Eclipse19, я о том, что это реально похоже на `товарищи ученые, у меня в подвале раздаются странные звуки` чего сразу не сделать нормально, а не фантазировать? 0

@Eclipse19 1 / 1 / 0 Регистрация: 04.03.2023 Сообщений: 129
	03.08.2023, 12:59 [ТС]
	pincet, бывает не так то и просто донести суть проблемы 0