Matej Matej - 4 months ago 13
jQuery Question

change css style after modal is hide

when I click on my table row there appear modal window and change "tr" background-color indicates for each row was modal opened. However, when I close my modal background color of tr remains the same. How to change it to default?

<tr class='revisions'>
<td>{{ $revision->date_of_revision->format('d.m.Y') }}
</td>

<td class="text-right">
<a
data-toggle="modal"
data-target="#revisionEdit"
class='btn btn-warning revisionEdit'>
<span class="glyphicon glyphicon-pencil"></span>
</a>

</td>
</tr>

Answer

If you're changing the color with JavaScript then you can use the Bootstrap modal events to change it back when hidden.

    $('.modal').on('hidden.bs.modal', function (e) {
        $("selector").css("background-color", "#EEEEEE");
    });

According to w3fools:

show.bs.modal Occurs when the modal is about to be shown.
shown.bs.modal Occurs when the modal is fully shown (after CSS transitions have completed)
hide.bs.modal Occurs when the modal is about to be hidden
hidden.bs.modal Occurs when the modal is fully hidden (after CSS transitions have completed)