title: Uncaught RangeError: Maximum call stack size exceeded, Chrome JS error
body: <p>I understand that this is caused by an infinite loop inside my js, but I cannot explain myself why. I want to a row click to trigger the button on the same row. I'm trying the following JQuery, but when I click on a row I end up with in infinite loop inside the row click function. Why is that?</p>
  
  <pre><code>$(document).on('pageinit', function (event) {
      bindRowClick();
  });
  
  function bindRowClick() {
      $('.orderTable').find('tr').click(function () {
          var btnView = $(this).find('td.tdViewOrder').find('input[type=submit]:first');
          btnView.trigger("click");
      });
  }
  </code></pre>
  
  <p>I've got a table with <code>class=".orderTable"</code> and a repeater inside the <code>&lt;tbody&gt;</code></p>
  
  <pre><code>&lt;tbody&gt;
     &lt;asp:Repeater ID="rptrOrderView" runat="server" OnItemDataBound="rptrOrderView_ItemDataBound" OnItemCommand="rptrOrderView_ItemCommand"&gt;
        &lt;ItemTemplate&gt;
             &lt;tr class="hand"&gt;
                &lt;td class="title"&gt;
                    &lt;asp:Label runat="server" ID="lblTdOrderNum"&gt;&lt;/asp:Label&gt;
                &lt;/td&gt;
                &lt;td class="tdViewOrder"&gt;
                    &lt;asp:Button runat="server" ID="btnViewOrder" Text="View" CssClass="btnViewOrder" SkinID="btnViewMiniB" CommandName="ViewOrder" /&gt;
                &lt;/td&gt;
             &lt;/tr&gt;
        &lt;/ItemTemplate&gt;
     &lt;/asp:Repeater&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p>I know that is very common question, but I still haven't solved my problem.</p>
  
  <p><strong>SOLUTION</strong></p>
  
  <p>I've added <code>event.stopPropagation();</code> to my click handler and is now working.</p>
  
  <pre><code>$(document).on('pageinit', function (event) {
      bindRowClick();
      $('.btnViewOrder').click(function (event) {
          event.stopPropagation();
      });
  });
  </code></pre>