'I want to make a popup appear in php

I am making a forum-like website in php and I added a button inside each question container to delete questions on the forum. I am looking for a way to make a popup appear when the user clicks the delete button. I am using bootstrap and I found a popup modal on the bootstrap website. With my current code, the popup appears when the button is clicked and it asks the user to confirm that he wants to delete his question. The problem is that I don't know how to get the ID of the question the users wants to delete so after I can delete it in my MySQL database.

This is my current button and it is inside a php echo '...'

<div class="col-1" title="delete your comment"><button name="delmsgbtn" class="btn-reseter" type="button" data-bs-toggle="modal" data-bs-target="#delmsg">delete</button></div>

And this is the popup modal from bootstrap that shows up when button is clicked

<div class="modal fade" id="delmsg" tabindex="-1" aria-labelledby="delmsgLabel" aria-hidden="false">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="delmsgLabel">Are you sure you want to delete this message?</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">cancel</button>
        <button type="button" class="btn btn-danger">delete</button>
      </div>
    </div>
  </div>
</div>

I had the idea to redirect the user to the same page but with the url containing the question id, so after I can have it using the get method. So I modified the button by adding a redirection.

New button also inside a php echo that is why the backslash

<div class="col-1" title="delete your comment"><button name="delmsgbtn" class="btn-reseter" onclick="location.href = \'course.php?courseid='.$_GET["courseid"].'&quesid='.$idQues.'\';" type="button" data-bs-toggle="modal" data-bs-target="#delmsg">delete</button></div>

But when doing this, the page refreshes and the popup disappears. Can you help me.

phphtmlbootstrap-modal


Solution 1:[1]

I would put the id of the element with php

like

<button id="element-id-<?php echo $id ?>" class="myBtn" >

then i would use a javascript function to do execute the call on database

<script>
const btn = document.querySelector('.myBtn')

btn.addEventLIstener('click', () => {
  const elementId = this.id //then remove the 'element-id-' from the value
  const data = { id: elementId }
  fetch( URLforBackend, {
   method: 'post',
   headers: {
     'Content-Type': 'application/json'
    }
    body: JSON.stringify(data)
  })
</script>

this will give to your backend the id. in php, in there, just do the deletion

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Rodrigo Ida

Related Questions