trigger click event in table

Question

This is my jquery code:

$("#tableGrid").on("click", "tr", function (event) {
    var link = $(this).find('.view-icon');
    link.trigger('click');
    console.log(link);
});

and I want to trigger this

<table id="tableGrid">
    <tr>
        <td>
            <div class='line-item-icons'>
                <i class='icon-view view-icon' data-url="${filePath}"></i>
            </div>
        </td>
    </tr>
</table>

but I receive this error:

Failed to start loading

How to solve this problem? The icon is inside the table.

Answer 1

Try this out in your jquery.Hope this works

$("#tableGrid").on("click", "tr", function (event) {
  var link = $(this).find('.view-icon');
  link.trigger('click',link);
});
$('.view-icon').click(function(e,link){
  e.stopPropagation();
  console.log(link);
});

Here only difference is that the link that you get in console.log(link) is element and not a jquery object. if you want it as a jquery object just wrap it as console.log($(link))

Answer 2

Update your jQuery in this way -

$("#tableGrid tr").on("click", function (event) {
  var link = $(this).children('.view-icon');
  link.trigger('click');
  console.log(link);
});