@remlin1000
любитель

Как отследить клик по строке таблицы с помощью jquery?

Есть таблица:
5c7a31a1af315864796055.png

Ее код с Twigom:
<table class="table table-hover">
    <thead>
    <tr>
        <th width="16px"></th>
        <th width="60px">Код</th>
        <th width="470px">Работа, услуга</th>
        <th width="70px">Единица</th>
        <th width="40px">Кол.</th>
        <th width="70px">Цена</th>
        <th width="70px">Сумма</th>

    </tr>
    </thead>
    <tbody>
    {% set total = 0 %}
    {% for service in bill %}
        <tr id="{{ service.Servicekod.Serviceid }}" class="service-row">
            <td><i class="far fa-trash-alt delete-service"></i></td>
            <td>{{ service.Servicekod.Serviceid }}</td>
            <td>{{ service.Servicekod.Servicename }}</td>
            <td>{{ service.Servicekod.Servicemeasurekod.Measureshortname }}</td>
            <td>{{ service.Servicecount|number_format(0,'.','') }}</td>
            <td>{{ service.Serviceprice }}</td>
            <td>{{ (service.Serviceprice * service.Servicecount)|number_format(2,'.','') }}</td>
            {% set total = total +  (service.Serviceprice * service.Servicecount) %}
        </tr>
    {% endfor %}
    </tbody>
    <tfoot>
    <td colspan="2">Итого:</td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td>{{ total|number_format(2,'.','') }}</td>
    </tfoot>
</table>


Мне необходимо, если пользователь кликает на строке таблицы, открыть диалог редактирования услуги.
Делаю так:
$(".service-row").click(
        function () {
            alert('Открываем для редактирования');
        }
    );


Но если пользоваьель кликает на иконке удаления услуги (корзинка), нужно удалить услугу:
Делаю так:

$(".delete-service").click(
        function () {
            alert('Удаляем услугу');
        }
    );


Но в этом случае, сначала срабатывает событие удаления ( $(".delete-service").click), а потом событие редактирования ($(".service-row").click().

Как можно выйти из ситуации, чтобы при клике на иконку обрабатывалось только событие $(".delete-service").click?
  • Вопрос задан
  • 479 просмотров
Решения вопроса 1
wapster92
@wapster92 Куратор тега JavaScript
stopPropagation() для $(".delete-service")
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы