CODEWITHSUNDEEP
javascripthtml
Ganga Manoj
Ganga Manoj

Reputation: 67

Triggering a modal window using a link

I have a table with a delete option against each row, which is a link that redirects to the delete function. I'm trying to add a modal with two buttons- cancel and delete- that gets triggered when I click on the delete link in the table. I used the following code to open the modal, but the console log showed that this error occured- Uncaught TypeError: modalBtn is null. Why is that? I just started learning javascript and any help would be greatly appreciated.

This is the html code for the link to open the modal:

<a id="open-modal" class="edit-delete" href="">Delete</a>

And this is the javascript code I used to obtain it:

var modalBtn = document.getElementById('open-modal');

Upvotes: 1

Views: 229

Answers (3)

Ganga Manoj
Ganga Manoj

Reputation: 67

I figured out what was wrong, the link to open the modal was in a loop so the same ID was being assigned multiple times.

Upvotes: 0

Muchlish Choeruddin
Muchlish Choeruddin

Reputation: 33

I don't know how your code, but my advice is just add attribute onclick like this

<a id="open-modal" class="edit-delete" href="" onclick="openModal()">Delete</a>

and in the javascript code just make the function you have named before

function openModal(){
    // this your function to show the modal
}

Upvotes: 1

Goldwave
Goldwave

Reputation: 599

There must be something else going on. You can test the below code, but i won't be able to tell you what's wrong with your code without more information.

var modalBtn = document.getElementById('open-modal');
console.log(modalBtn)

function openModal(){
   confirm("delete?");
}
<a id="open-modal" onClick="openModal()" class="edit-delete" href="">Delete</a>

Upvotes: 3

Related Questions