Why in my JS popup my html form doesn't work?

Question

I make a popup which says "are you sure you want to delete the category?" If they say yes, exec a form but this form doesn't work?

The html code:

 var modal = document.getElementById("popup"); var btns = Array.prototype.slice.call(document.querySelectorAll(".remove_openpopup")); var span = document.getElementsByClassName("close_button")[0]; btns.forEach(function(btn) { btn.onclick = function() { modal.style.display = "block"; } }); span.onclick = function() { modal.style.display = "none"; } span2.onclick = function() { modal.style.display = "none"; } window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; } }

 <body> <a href="#" class="remove_openpopup">remove</a> <a href="#" class="remove_openpopup">remove2</a> <a href="#" class="remove_openpopup">remove3</a> <div id="popup" class="popup"> <div class="popup_content"> <span class="close">&times;</span> <p>Are you sure you wan't delete this categorie ?</p> <button class="button_popup close_button">No</button> <button class="button_popup close_button" onclick='document.getElementByClassName("remove").submit()'>Yes</button> </div> </div> <form class="remove" method="post"><input type="hidden" name="remove" /></form> </body>

The test script:

if (isset($_POST['remove'])) {
  echo "a";
}

When I click yes nothing happen. Someone have an idea?

Answer 1

You are using getElementByClassName but it doesn't exist. The closest thing is getElementsByClassName, which returns an array of elements with the requested class name, but in this case I think you should use getElementById and set the id property to your form:

<body>
    <a href="#" class="remove_openpopup">remove</a>
    <a href="#" class="remove_openpopup">remove2</a>
    <a href="#" class="remove_openpopup">remove3</a>

    <div id="popup" class="popup">
      <div class="popup_content">
        <span class="close">&times;</span>
        <p>Are you sure you wan't delete this categorie ?</p>
        <button class="button_popup close_button">No</button>
        <button class="button_popup close_button" onclick='document.getElementById("remove").submit()'>Yes</button>
      </div>
    </div>
    <form id="remove" method="post"><input type="hidden" name="remove" /></form>
</body>

Why in my JS popup my html form doesn't work?

Question

1 answers

solution1
1 ACCPTED 2019-06-01 14:48:22

Why in my JS popup my html form doesn't work?

Question

1 answers

solution1 1 ACCPTED 2019-06-01 14:48:22

solution1
1 ACCPTED 2019-06-01 14:48:22