title: Uncaught RangeError: Maximum call stack size exceeded - JQuery form submission error
body: <p>I have a single input outside the form</p>
  
  <pre><code>&lt;input id="BrId" name="BrId" type="text" value="1"&gt;
  </code></pre>
  
  <p>HTML Form- </p>
  
  <pre><code> &lt;form id="photoform" enctype="multipart/form-data" method="post" action="server-side-path"&gt;
      &lt;input type="file" id="Photos" name="photo"/&gt;
      &lt;input type="hidden" name="VisitGuid" value="5" /&gt;
      &lt;input type="hidden" name="HiddenBrId" id="HiddenBrId" value="" /&gt;
      &lt;input type="submit" /&gt;
  </code></pre>
  
  <p></p>
  
  <p>JQuery-</p>
  
  <pre><code>$('#photoform').on('submit', function (e) { 
       e.preventDefault();
       $('#HiddenBrId').val($('#BrId').val());
       $('#photoform').submit();
  });
  </code></pre>
  
  <p>When I click on submit button, form is not being submitted and console says <code>Uncaught RangeError: Maximum call stack size exceeded</code></p>
  
  <p>Any help?</p>