jQuery <tr> link except button which opens Bootstrap Modal
<p>So I wanted to make my <code>&lt;tr&gt;'s</code> clickable / linked to a corresponding page. All rows have a button to delete the row aswell. Unfortunately when an user Clicks on the delete button it still links as the row is clicked. I added code so it would do that except button click.. so it could open the <code>bootstrap modal</code> for delete confirmation.</p>

<p>My script :</p>

<pre><code>$('tr[data-href]:not(:button)').on("click", function() {
    document.location = $(this).data('href');
});
$('tr button[data-target]').on("click", function() {
    document.location = $(this).data('target');
});
</code></pre>

<p>HTML table with Blade foreach </p>

<pre><code>                                  &lt;tr style="cursor:pointer;!important;" data-href="/bugs/{{$project-&gt;id}}"&gt;
                                  &lt;td&gt;{{$project-&gt;created_at-&gt;format('d-m-Y')}}&lt;/td&gt;
                                  &lt;td&gt;{{$project-&gt;projectnaam}}&lt;/td&gt;
                                  &lt;td&gt;{{$project-&gt;liveurl}}&lt;/td&gt;
                                  &lt;td&gt;{{$project-&gt;developmenturl}}&lt;/td&gt;
                                  &lt;td&gt;{{$project-&gt;user-&gt;voornaam .' '. $project-&gt;user-&gt;tussenvoegsel .' '. $project-&gt;user-&gt;achternaam }}&lt;/td&gt;
                                  &lt;td&gt;{!! substr($project-&gt;omschrijvingproject,0,90) !!}&lt;/td&gt;
                                  &lt;td class="text-right" &gt;
                                  &lt;a href="/projectmuteren/{{$project-&gt;id}}" class=""&gt;
                                       &lt;button class="btn btn-success btn-xs wijzigKnop2" name="zoekProject" type="button" data-project="{{$project-&gt;projectnaam}}"&gt;
                                              &lt;i class="glyphicon glyphicon-pencil"&gt;&lt;/i&gt;
                                       &lt;/button&gt;
                                  &lt;/a&gt;
                                  &lt;button type="button" class="btn btn-danger btn-xs" data-toggle="modal" data-target="#myModal{{$project-&gt;id}}"&gt;
                                    &lt;i class="glyphicon glyphicon-trash"&gt;&lt;/i&gt;
                                  &lt;/button&gt;
                                    &lt;/td&gt;
                                  &lt;/tr&gt;
</code></pre>

<p>Delete modal</p>

<pre><code>&lt;div class="modal fade" id="myModal{{$proj-&gt;id}}" tabindex="-1" role="dialog"&gt;
               &lt;div class="modal-dialog"&gt;
                 &lt;div class="modal-content"&gt;
                   &lt;div class="modal-header"&gt;
                     &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;&lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;&lt;/button&gt;
                     &lt;h4 class="modal-title"&gt;Verwijder verzoek&lt;/h4&gt;
                   &lt;/div&gt;
                   &lt;div class="modal-body"&gt;
                     &lt;p&gt;Weet u zeker dat u het project : &lt;strong&gt;{{$proj-&gt;titel}}&lt;/strong&gt; met alle gekoppelde data wilt verwijderen&amp;hellip;&lt;/p&gt;
                   &lt;/div&gt;
                   &lt;div class="modal-footer"&gt;
                     &lt;button type="button" class="btn btn-default btn-xs pull-right" data-dismiss="modal"&gt;Sluit&lt;/button&gt;
                     &lt;form method="POST" action="/verwijderProject/{{$proj-&gt;id}}" &gt;
                     {!! method_field('DELETE') !!}
                     {!! csrf_field() !!}
                     &lt;button type="submit" class="btn btn-danger btn-xs pull-left"&gt;
                        {{--&lt;i class="glyphicon glyphicon-trash"&gt;&lt;/i&gt;--}}
                        Verwijder project
                     &lt;/button&gt;
                     &lt;/form&gt;
                   &lt;/div&gt;
                 &lt;/div&gt;&lt;!-- /.modal-content --&gt;
               &lt;/div&gt;&lt;!-- /.modal-dialog --&gt;
             &lt;/div&gt;&lt;!-- /.modal --&gt;
</code></pre>

<p>Please reply with any solution on how to exclude the button click..</p>