nemo_87
nemo_87

Reputation: 4791

Uncaught RangeError: Maximum call stack size exceeded in Chrome

I've keep getting this error from JavaScript. It happens each time I select/deselect ckhDirectDebit checkbox.

Here is the code:

<script type="text/javascript">
    $(document).ready(function () {
        var isDirectDebitSelected = $('#<%=chkDirectDebit.ClientID%>');
        var sameAsMerchantBankCheckbox = $('#<%=chkSameAsMerchantBank.ClientID%>');
        var sameAsMerchantBankLabel = $('#<%=txtSameAsMerchantBank.ClientID%>');

        function setSameAsMerchantVisible() {
            if (isDirectDebitSelected.is(':checked')) {
                sameAsMerchantBankCheckbox.show();
                sameAsMerchantBankLabel.show();
            } else {
                sameAsMerchantBankCheckbox.hide();
                sameAsMerchantBankLabel.hide();
            }

            isDirectDebitSelected.bind('change', function () {
                setSameAsMerchantVisible();
            });

            setSameAsMerchantVisible();
        }
    });
</script>

<asp:CheckBox runat="server" ID="chkDirectDebit" />
<asp:Label runat="server" AssociatedControlID="chkSameAsMerchantBank" ID="txtDirectDebit" meta:resourcekey="lblDirectDebit"></asp:Label>
<asp:CheckBox runat="server" ID="chkSameAsMerchantBank" OnCheckedChanged="chkSameAsMerchantBank_CheckedChanged" AutoPostBack="True" Checked="True" />
<asp:Label runat="server" AssociatedControlID="txtSameAsMerchantBank" ID="txtSameAsMerchantBank" meta:resourcekey="lblSameAsMerchantBank"></asp:Label>

Anyone knows what I'm doing wrongly in js? And what is the potential problem that causes this exception?

Upvotes: 0

Views: 523

Answers (3)

Grundy
Grundy

Reputation: 13381

You have infinite recursion because inside setSameAsMerchantVisible called setSameAsMerchantVisible again without any condition.
Seems like you have a typo and should move close bracket a bit higher

function setSameAsMerchantVisible() {
    if (isDirectDebitSelected.is(':checked')) {
        sameAsMerchantBankCheckbox.show();
        sameAsMerchantBankLabel.show();
    } else {
        sameAsMerchantBankCheckbox.hide();
        sameAsMerchantBankLabel.hide();
    }
} // <-- to here
    isDirectDebitSelected.bind('change', function () {
        setSameAsMerchantVisible();
    });

    setSameAsMerchantVisible();

//} from here 

Upvotes: 3

DfrDkn
DfrDkn

Reputation: 1370

This is happening because your code is going in an infinite loop due to recursive call as below -

 function setSameAsMerchantVisible() {

// other code  
            setSameAsMerchantVisible();
        }

The stack is overflowing due to recursive call.

Upvotes: 1

Nishad K Ahamed
Nishad K Ahamed

Reputation: 1394

this situation probably occurs when program falls in an infinite loop..

you are recursively calling the function setSameAsMerchantVisible()

Upvotes: 1

Related Questions