Too much recursion in JavaScript

Question

I have this JavaScript which opens new page:

$(document).ready(function () {
    //$('a[id$="lnkHidden"]').trigger("click");    // Not sure if this is actually necessary

    $('table[id$="dataTable"]').find("tbody").on("click", "tr", function () {
        $(this).find('a[id$="lnkHidden"]').trigger("click");
    });
});

This is the button which is called by the JS script:

<h:commandLink id="lnkHidden" action="#{bean.pageRedirect}" style="text-decoration:none; color:white; display:none">

</h:commandLink>

After I click on a table row I get this error message:

too much recursion [Break On This Error] ...,c=l.length;c--;)(f=l[c])&&(v[d[c]]=!(y[d[c]]=f));if(i){if(o||e){if(o){for(l=‌[],...

Can you help me to fix this?

The problem is you are triggering a click event on a child which in turn triggers the parent tr's click event, causing an infinite loop. You need to stop the propagation at some point, return false from within the click event of the a tag — Justin Bicknell
– Justin Bicknell, Commented Apr 8, 2013 at 21:29
Are you inserting those anchors (links) dynamically into the table? Because that would make things more difficult. — bfavaretto
– bfavaretto, Commented Apr 8, 2013 at 21:31
@bfavaretto no, just calling link by id. Can you provide some example how to fix this problem. The code works but with infinite loop. — Peter Penzov
– Peter Penzov, Commented Apr 8, 2013 at 21:33

atondelier · Accepted Answer · 2013-04-08 22:12:57Z

1

You can cut the infinite loop with those changes from your original code

add a second argument to trigger. The call becomes .trigger("click", [ true ])
name arguments in the event handler : function(event, simulated)
use the simulated argument which is set to true from the trigger : simulated || $(this).find('a[id$="lnkHidden"]').trigger("click", [ true ]);

However that event triggering and that kind of selectors are not recommended.

answered Apr 8, 2013 at 22:12

atondelier

2,43417 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

bfavaretto · Accepted Answer · 2013-04-09 00:51:14Z

1

Instead of triggering synthetic click events, you could just change the current URL directly:

$(document).ready(function () {
    $('table[id$="dataTable"]').find("tbody").on("click", "tr", function () {
        var links = $(this).find('a[id$="lnkHidden"]');
        if(links.length && links[0].href) {
            window.location.href = links[0].href;
        }
    });
});

answered Apr 9, 2013 at 0:51

bfavaretto

71.9k18 gold badges118 silver badges162 bronze badges

1 Comment

bfavaretto Over a year ago

Sorry for deleting my previous answer without warning. You reported it didn't work, and I found a serious logical problem in it, so here is an alternate solution. Hope it helps!

Collectives™ on Stack Overflow

Too much recursion in JavaScript

2 Answers 2

Comments

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Related