React.js and jquery Uncaught ReferenceError: (function) is not defined at HTMLTableRowElement.onclick

Question

js in my web app, i was just creating table with work, but sadly onClick on a Uncaught ReferenceError: (function) is not defined at HTMLTableRowElement.onclick

here is table code $("#usertable").append("<tr onclick=\"displaySmth('" + smth_value + "')\"><td>" + username + "</tr></td>");

and function to display smth_value

   displaySmth(somevalue){
    $("#smth_id").text(somevalue)
}

I think you'll need to share a bit more code. Where do you add the onclick listener? — Andrew Lohr, Apr 19 '18 at 16:06
oh sorry, i just failed while writing this question, updated it already, now you can see the onclick listener — jj.badweyn, Apr 19 '18 at 16:36

score 1 · Accepted Answer · answered Apr 19 '18 at 16:58

1

With the way you're adding your click listener, the displaySmth function has to be a direct child of the window object; if you're using React.js then this probably isn't the case.

A more common way to add click listeners in React is to inject the function itself (rather than the name), like this:

$("#usertable").append(
    <tr onclick={displaySmth}><td>{username}</td></tr>
);

This is a touch more complicated when you want to use parameters in your listener, but the concept is the same.

answered Apr 19 '18 at 16:58

Matthew Schlachter

3,250
1
12
26

Are you sure that there is no need to user quotation marks? when im using simple `$("#usertable").append( +username+)` its not even giving me usernames in table – jj.badweyn Apr 19 '18 at 17:11
It depends a bit on where the code is; if it's in a file that get's compiled (which is most common with react) then quotation marks around html-ish objects aren't needed, but if it's in a non-compiled js file then they will be. [This](https://code.tutsplus.com/tutorials/working-with-tables-in-react-part-one--cms-29682) is a pretty good tutorial for getting started with tables in React – Matthew Schlachter Apr 19 '18 at 17:34

React.js and jquery Uncaught ReferenceError: (function) is not defined at HTMLTableRowElement.onclick

1 Answers1