Rewrite inline javascript to external function - this reference

Question

I'm trying to rewrite some javascript code from an inline button onclick call to an regular javascript function.

I used the this reference in my code to remove a table column, which worked perfectly fine. Since I need to use the line of code on a few places I want it to be in a regular javascript function.

What I had:

<button type="button"  tabindex="-1" class="btn btn-secondary btn-tblrmv" onclick="if(!$(this).closest('tr').hasClass('notDeletable')){ $(this).closest('tr').remove(); }">
   <i class="mdi mdi-minus"></i>
</button>

as for the javasript function itself:

function removeTableRow(){
     if(!$(this).closest('tr').hasClass('notDeletable')){ 
          $(this).closest('tr').remove(); 
     }
}

Could someone please explain, why this isn't working as intended?

$(this) is referenced if you call it from inside an element, otherwise you need to pass it to your custom function as a parameter function removeTableRow(element){ — GrafiCode
– GrafiCode, Commented May 6, 2019 at 14:12

GrafiCode · Accepted Answer · 2019-05-06 14:27:06Z

2

This do not work because this is not referring to the current element. Try with:

HTML:

  <button type="button" tabindex="-1" class="btn btn-secondary btn-tblrmv" onclick="removeTableRow(this)">
       <i class="mdi mdi-minus"></i>
    </button>

JS:

function removeTableRow (row) {
     if (!$(row).closest('tr').hasClass('notDeletable')) { 
          $(row).closest('tr').remove(); 
     }
}

edited May 6, 2019 at 14:27

GrafiCode

3,3653 gold badges31 silver badges33 bronze badges

answered May 6, 2019 at 14:12

Mosè Raguzzini

15.9k1 gold badge34 silver badges46 bronze badges

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

2 Comments

lechnerio Over a year ago

ah, wow. thank you very much. I didn't know I cloud just reference like this! Will mark you as correct in a couple days as soon as stackoverflow let's me

Mosè Raguzzini Over a year ago

No problem mate, glad I've helped :)

Collectives™ on Stack Overflow

Rewrite inline javascript to external function - this reference

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related