change css style after modal is hide

Question

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>

score 0 · Answer 1 · edited May 23 '17 at 12:32

0

You can bind an event on closing of the modal popup. Check the answer

$('#myModal').on('hidden.bs.modal', function () { // do something… })

See getbootstrap.com/javascript/#modals-events

edited May 23 '17 at 12:32

Community

1
1

answered Aug 01 '16 at 18:40

Nalin Aggarwal

886
5
8

score 0 · Accepted Answer · answered Aug 01 '16 at 18:41

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)

change css style after modal is hide

2 Answers2