bootstrap dropdown in table

1<div class="dropdown">
2  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
3    Dropdown
4  </button>
5  <div class="dropdown-menu" aria-labelledby="dropdownMenu2">
6    <button class="dropdown-item" type="button">Action</button>
7    <button class="dropdown-item" type="button">Another action</button>
8    <button class="dropdown-item" type="button">Something else here</button>
9  </div>
10</div>

1<div class='position-relative'>
2...
3  <td>
4  <!-- Make sure position is static -->
5  <div class="dropdown position-static actions d-inline-block">
6      <button class="btn btn-light px-1 py-0 mt-1 dropdown-toggle actions-btn" type="button"
7          id="table-action" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
8          <i class="mdi mdi-dots-horizontal"></i>
9      </button>
10      <div class="dropdown-menu" aria-labelledby="table-action">
11          <a class="dropdown-item" href="#">Action</a>
12          <a class="dropdown-item" href="#">Another action</a>
13          <a class="dropdown-item" href="#">Something else here</a>
14      </div>
15  </div>
16</td>
17...
18</div>
19
20<script>
21    $(function() {
22        $('.actions').on('shown.bs.dropdown', function(e) {
23            let menu = $(this).find('.dropdown-menu');
24            let parent = $(this).parents('td').position().top;
25            let top = $(this).position().top;
26            let height = $(this).height();
27            
28            top = (top + parent);
29
30            $("head").append('<style type="text/css" id="new-style"></style>');
31
32            var newStyleElement = $("head").children('#new-style');
33            newStyleElement.html('.dropdown-menu[x-placement^="left"],' +
34                '.dropdown-menu[x-placement ^= "right"],' +
35                '.dropdown-menu[x-placement ^= "top"] {' +
36                'top:' + (top + height) + 'px !important;' +
37                '}'
38            );
39
40            $('.actions').on('hide.bs.dropdown', function() {
41                $("head").children('#new-style').remove();
42            });
43        })
44    });
45
46</script>