Uncaught RangeError: Maximum call stack size exceeded - JQuery form submission error
<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>