title: Get the table row id on click
body: <p>I have this <code>&lt;td&gt;</code> tag:</p>
  
  <pre><code>&lt;td align="center"&gt;
     &lt;div class="dropdown"&gt;
        &lt;button onclick="myFunction()" class="btn btn-default glyphicon glyphicon-picture" id=@TableRowId&gt;&lt;/button&gt;
           &lt;div id="myDropdown" class="dropdown-content"&gt;
              &lt;a href="#"&gt;Show&lt;/a&gt;
              &lt;a href="#"&gt;Edit&lt;/a&gt; 
           &lt;/div&gt;
     &lt;/div&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>And this JavaScript function:</p>
  
  <pre><code>function myFunction() {
     document.getElementById("myDropdown").classList.toggle("show");
  }
  </code></pre>
  
  <p>Image of the Table:</p>
  
  <p><a href="https://i.stack.imgur.com/rSr4x.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/rSr4x.png" alt="Image of table"></a></p>
  
  <p>I need to get the specific ID row when click in the picture image to open drop-down menu for that row.</p>
  
  <p>I have an ID iterator: <code>@TableRowId</code> that gets the row number.</p>