How to attach onclick event to an element dinamically created

Question

I'm trying to trigger an event attached to a html tag

This table is builded insde a function

    function detail(id){
      console.log(id)
    }

function search(data){
                $.post(url, {valorBusqueda: textoBusqueda}, function(data) {

                    data = JSON.parse(data);

                        $.each(data, function(i, val){

                                id = val.id;


                                html += '<tr onclick="detail('+id+')">';
                                html += '<tr>';
                            }
                        });      

                 }); 
}

But when I click the element I get this err:

Uncaught ReferenceError: detallePaciente is not defined

when is actually defined in my file

any idea how could I solve this?

`Uncaught ReferenceError: detallePaciente is not defined` yet your function is called `detail` and nowhere does it say `detallePaciente` — Wendelin, Aug 20 '19 at 18:42

score 1 · Accepted Answer · answered Aug 20 '19 at 18:45

1

Change this line:

html += '<tr class="clickedclass" data-id = "' + id + '">';

And make alert from this in Jquery:

$("body").on("click", ".clickedclass", function(){
  var id = $(this).attr("data-id");
  console.log(id);
});

answered Aug 20 '19 at 18:45

Ankur Mishra

1,235
1
4
13

score 0 · Answer 2 · answered Aug 20 '19 at 18:40

0

You have a syntax error in your function declaration.

It should be:

function detail(data) {
...
}

Same error with the search function. Would need to see how you attach it to the click event to help with that.

answered Aug 20 '19 at 18:40

Victor P

1,267
13
23

How to attach onclick event to an element dinamically created

2 Answers2