const length = $('.item').length; //получили количество например 21
const toDelete = length % 4; // остаток от деления на 4 – те самые лишние
$('.item').slice(-toDelete).addClass('hidden'); // добавить класс с display: none
id
и переименовываем его в priceId
, чтобы не конфликтовало с нужным внешним id
.priceId
со значением arg.id
переданного в функцию объекта.(inputArg) => {
const priceId = inputArg.id;
// ...
}
names
и price
чётко связаны ещё и позициями элементов в массиве?- window.addEventListener('load', () => {
+ $(window).on('load', () => {
- prev.splice(prev.indexOf(path[item], 1));
+ prev.splice(prev.indexOf(path[item]), 1);
$arr = [1,2,3];
function myFunc($item) {
// ...
}
array_map('myFunc', $arr);
let object = new URLSearchParams({
'ID[]': data,
})
Только вариант с добавления ключ-значение по одному. Как я предложил выше. forEach(... append() ...)
data
оказывается массив ID'шек. Достаточно его значения по одному добавить append'ом():const childBlock = document.querySelectorAll('.child-block');
// const elem = document.querySelectorAll('.elem');
// const amount = document.querySelectorAll('.amount');
document.querySelectorAll('.btn-all').forEach(n => {
n.addEventListener('click', onGetDataClick);
});
let data;
const key = 'ID[]';
function onGetDataClick({ target }) {
data = Array.from(target.closest('.child-block').querySelectorAll('.elem')).flatMap(n =>
Array(+n.querySelector('input').value).fill(+n.dataset.id)
);
console.log(data);
const usp = new URLSearchParams();
data.forEach(id => usp.append(key, id));
const url = `https://example.com/api/method?${usp.toString()}`;
console.log('URL: %s', url);
}
// counter
const max = Math.max(2);
const min = Math.min(0);
childBlock.forEach(button => {
button.addEventListener('click', e => {
const isPlusBtnOne = e.target.classList.contains('btn__plus-one');
const isMinusBtnOne = e.target.classList.contains('btn__minus-one');
const isPlusBtnTwo = e.target.classList.contains('btn__plus-two');
const isMinusBtnTwo = e.target.classList.contains('btn__minus-two');
const counterBlock = e.target.closest('.elem');
if (isPlusBtnOne || isMinusBtnOne || isPlusBtnTwo || isMinusBtnTwo) {
const input = counterBlock.querySelector('.amount');
if (isPlusBtnOne || isPlusBtnTwo) {
input.value = Number(input.value) + 1;
if (input.value >= max) {
input.value = max;
}
}
if (isMinusBtnOne || isMinusBtnTwo) {
input.value = Number(input.value) - 1;
if (input.value <= min) {
input.value = min;
}
}
}
});
});
const url = `${route("url")}?${obj}`;
// повтор имени
?id=1&id=2
// то же, с квадратными скобками
?arr[]=3&arr[]=4 // будет ?arr%5B%5D=3&arr%5B%5D=4
// перечисление через разделитель:
?id=5,6
URLSearchParams.toString()
поступает как первые два варианта:const usp = new URLSearchParams();
usp.append('id', 1);
usp.append('id', 2);
usp.append('arr[]', 3);
usp.append('arr[]', 4);
usp.toString()
// "id=1&id=2&arr%5B%5D=3&arr%5B%5D=4"
?a=A&b=B
удобнее их передавать в теле запроса, не GET'ом, а POST или PUT запросом. Уточните у бэка, сумеет ли он принять JSON в теле POST-запроса?
renderCars()
только добавляет в div новые элементы. А стирать? )Раз уж решили "источником правды" держать глобальный массив
const currentCars
, надо заморачиваться и сохраняя его, удалять только-элементы при очистке. И добавлять в него.Отрисовку лучше делать всё равно каждый раз с нуля – стирать всё в info, затем рисовать в него всё, что есть в "источнике правды".