onClick in table row does not work in JavaScript/jQuery

Question

The links work in this example, but the onClick does nothing. When I display the productURL[i] in an alert() it shows the correct URL. Any suggestions?

var output='<table class="api-table">';
output+='<thead><tr><th colspan="2">' + productSubstrateName + '</th></tr></thead>';
for (var i=0;i<productURL.length;i++) {
output+='<tr>';
output+='<td style=\"cursor:pointer;\" onClick=\"'+productURL[i]+'\"><a href="'+productURL[i]+'">'+productSubstrateAmounts[i]+'</a></td>';
    output+='<td style=\"cursor:pointer;\" onClick=\"'+productURL[i]+'\"><a href="'+productURL[i]+'">'+productSubstratePrices[i]+'</a></td>';
    output+='</tr>';
}

 output+="</table>";

 $('#'+outputdiv).append(output);

What do you expect onClick to do, since you're also wrapping the contents with a link? — Reinstate Monica Cellio
– Reinstate Monica Cellio, Commented Apr 11, 2013 at 10:47

bipen · Accepted Answer · 2013-04-11 10:45:07Z

2

but the onClick does nothing.

it does nothing becuase you have done nothing there ..you are just printing the value ..

  onClick=\"'+productURL[i]+'\"
        //--^^^^^^^^^^^----

if you need to do something then you can call a function there

  onClick="myFunction("'+productURL[i]+'")"

and your function

 function myFunction(obj){
    alert(obj);
 }

and you don't have to use \ there

answered Apr 11, 2013 at 10:45

bipen

36.6k9 gold badges51 silver badges62 bronze badges

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

2 Comments

user451513 Over a year ago

That doesn't work also. The strange thing is that the anchor ref. does work, I print the value there also and it goes to the link in the array element when clicking on the link. It's the td onclick that does nothing. The anchor tags are for testing purposes, just to verify that the actual link is valid.

bipen Over a year ago

try this function myFunction(obj){ alert(obj);window.location=obj; }

user451513 · Accepted Answer · 2013-04-11 11:04:57Z

0

Beginners mistake, thanks bipen, I forgot the document.location.href. :-(

        for (var i=0;i<productURL.length;i++) {
            output+='<tr>';
            output+='<td style="cursor:pointer;" onClick="document.location.href=\''+productURL[i]+'\';"><a href="'+productURL[i]+'">'+productSubstrateAmounts[i]+'</a></td>';
            output+='<td style="cursor:pointer;" onClick="document.location.href=\''+productURL[i]+'\';"><a href="'+productURL[i]+'">'+productSubstratePrices[i]+'</a></td>';
            output+='</tr>';
        }

answered Apr 11, 2013 at 11:04

user451513

Collectives™ on Stack Overflow

onClick in table row does not work in JavaScript/jQuery

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related