Запретить открытие другого модального окна при нажатии на кнопку внутри tr td, где нажатие на tr открывает другое модаль ⇐ Javascript

[Гость]

Итак, у меня есть веб-страница с таблицей. Я связал каждый tr, чтобы открыть модальное окно с подробной информацией.

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

Я обратился к этому вопросу и достиг определенного уровня или функциональности. Моя кнопка открывает правильное модальное окно, но когда я нажимаю снаружи или нажимаю на элементы ввода модального окна или кнопку закрытия, открывается модальное окно, связанное с tr.

Может ли кто-нибудь помочь мне исправить это, чтобы при нажатии кнопки открывалось и работало правильно только модальное окно, связанное с ней, например, оно принимало ввод и правильно закрывалось вместо открытия модального окна, связанного с tr?

Кнопка редактирования открывает правильное модальное окно. Но если я нажму где-нибудь на модальном окне, оно закроется и откроется модальное окно, связанное с tr кнопкой привязки.

Я хочу, чтобы modalBtn открывал связанное с ним модальное окно, и все работало правильно. Если я закрою это модальное окно, модальное окно, связанное с tr, не должно открыться. По сути, в этом сценарии мне нужны два модала. Тот, который открывается, когда я нажимаю в любом месте tr, один модальный, который открывается, когда я нажимаю кнопку редактирования, которая находится внутри tr в этом последнем столбце. Пожалуйста, максимально упростите свой ответ, спасибо.

Чтобы прояснить мой первоначальный вопрос: Я могу применить свою функцию ко всем тегам tr. Вопрос в том, что у меня есть последний столбец, в котором есть кнопки. Две из этих кнопок связаны со своими уникальными модальными окнами. Когда я нажимаю где-нибудь в tr, открывается правильное модальное окно. Также, когда я нажимаю кнопку, открывается правильное модальное окно. Проблема возникает здесь: когда я нажимаю в любом месте экрана, даже на текущий модальный элемент ввода, текущий модальный элемент закрывается и открывается модальный элемент, связанный с тегом tr, который работает нормально. Я хочу, чтобы все модальные окна работали нормально.

Я изменил код, чтобы вы могли просто запустить HTML и проверить проблему. Это не исходная таблица, а лишь небольшой пример моей проблемы.

$(document).ready(() => { Array.from($('tr[id*="Deets"]')).forEach(element => { element.addEventListener('click', (e) => { if (e.target.parentElement.classList.contains('modalBtn')) { e.stopPropagation() } еще { document.querySelector(`#anchor${element.id.split('Deets')[1]}`).click() } }) }); Array.from($('td .modalBtn')).forEach(ele => { console.log(еле); ele.addEventListener('click', (e) => { е.stopPropagation(); console.log(e.target.parentElement.nextElementSibling.getAttribute('id')); $(`#${e.target.parentElement.nextElementSibling.getAttribute('id')}`).modal('show'); }) }) }) Привет, В О р л д ! & л т ; / т я т л Это & г т ; & л т ; / час Это а д & г т ; & л т ; б О д и & г т ; & л т ; т а б л Это с л а с с = " т а б л Это т а б л Это - б О р д Это р л Это с с " & г т ; & л т ; т час Это а д & г т ; & л т ; т р & г т ; & л т ; т час с с О п Это = " с О л " с л а с с = " В - 3 0 " & г т ; р Это м а р к с & л т ; / т час & г т ; & л т ; т час с с О п Это = " с О л " & г т ; & л т ; / т час & г т ; & л т ; / т р & г т ; & л т ; / т час Это а д & г т ; & л т ; т б О д и & г т ; & л т ; т р я д = " д Это м О Д Это Это т с 1 " & г т ; & л т ; т д с с О п Это = " р О В " & г т ; & л т ; л а б Это л ж О р = " " т я т л Это = " р Это м а р к " & г т ; р Это м а р к & л т ; / л а б Это л & г т ; & л т ; / т д & г т ; & л т ; т д с с О п Это = " р О В " & г т ; & л т ; а с л а с с = " я с О н - 3 м О д а л Б т н " & г т ; И д я т & л т ; / а & г т ; & л т ; д я в с л а с с = " м О д а л ж а д Это " я д = " Это д я т 1 " т а б я н д Это Икс = " - 1 " а р я а - час я д д Это н = " т р в Это " & г т ; & л т ; д я в с л а с с = " м О д а л - д я а л О г м О д а л - л г " & г т ; & л т ; д я в с л а с с = " м О д а л - с О н т Это н т " & г т ; & л т ; д я в с л а с с = " м О д а л - час Это а д Это р " & г т ; & л т ; б & г т ; час Это а д я н г 1 & л т ; / б & г т ; & л т ; б в т т О н т и п Это = " б в т т О н " с л а с с = " б т н - с л О с Это " д а т а - б с - д я с м я с с = " м О д а л " а р я а - л а б Это л = " С л О с Это " & г т ; & л т ; / б в т т О н & г т ; & л т ; / д я в & г т ; & л т ; д я в с л а с с = " м О д а л - б О д и " & г т ; & л т ; я н п в т т и п Это = " т Это Икс т " с л а с с = " б я г - я н п в т - В 1 3 час 4 ж О р м - с О н т р О л " н а м Это = " м а я л " & г т ; & л т ; / д я в & г т ; & л т ; / д я в & г т ; & л т ; / д я в & г т ; & л т ; / д я в & г т ; & л т ; / т д & г т ; & л т ; / т р & г т ; & л т ; а я д = " а н с час О р 1 " д а т а - б с - т О г г л Это = " м О д а л " д а т а - б с - т а р г Это т = " # д Это м О Д Это Это т с 1 " & г т ; & л т ; / а & г т ; & л т ; д я в с л а с с = " м О д а л ж а д Это " я д = " д Это м О Д Это Это т с 1 " т а б я н д Это Икс = " - 1 " а р я а - час я д д Это н = " т р в Это " & г т ; & л т ; д я в с л а с с = " м О д а л - д я а л О г м О д а л - л г " & г т ; & л т ; д я в с л а с с = " м О д а л - с О н т Это н т " & г т ; & л т ; д я в с л а с с = " м О д а л - час Это а д Это р " & г т ; & л т ; б & г т ; час Это а д я н г & л т ; / б & г т ; & л т ; б в т т О н т и п Это = " б в т т О н " с л а с с = " б т н - с л О с Это " д а т а - б с - д я с м я с с = " м О д а л " а р я а - л а б Это л = " С л О с Это " & г т ; & л т ; / б в т т О н & г т ; & л т ; / д я в & г т ; & л т ; д я в с л а с с = " м О д а л - б О д и " & г т ; & л т ; д я в с л а с с = " с О л - л г - 1 2 " & г т ; & л т ; / д я в & г т ; & л т;/дел> примечание Редактировать заголовок1 заголовок примечание Редактировать заголовок1 заголовок