Как изменить значение элемента от пра-пра-прадеда

Question

У меня есть панели, которые генерируются динамически, и внутри каждой панели есть таблица, которая также генерируется динамически.

Нажав кнопку удаления, я бы хотел уменьшить значение `span.rows- счетчик, но только его соответствующей панели.

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

Answer 1

Используйте атрибут target, чтобы соответствовать правильному родительскому элементу панели. Выглядело бы примерно так:

$(".deleteItem").click(function(){
    let targetId = $(this).closest(".collapse").attr("id");
    let counter = $(".list-group-item[data-target='#"+ targetId +"']").find("#counter-" + targetId);
    counter.text(parseInt(counter.text()) - 1);
});

Почти всегда есть решение с использованием некоторой комбинации этих jquery функций: closest (); родитель (); дети(); следующий(); пред (); find ();

Кроме того, использование более подробных имен классов обычно упрощает решение. Например, я бы дал .list-group-item другой класс, например .menu-item.