[FIXED] How can I get the confirmation box to work with jsp?

Issue

so every time I want to delete a record from the database I want to show a confirmation box, the box shows successfully, but the problem is that record is deleting whether I click on "OK" or "Cancel"

How to get this to work ? Thanks

this my code:

                         <table>
                                   <thead>
                                        <tr>
                                            <th>ID</th>
                                            <th>Date RDV</th>
                                            <th>Motif</th>
                                            <th>ID Patient</th>
                                            <th>Action</th>
                                        </tr>


                                        </thead>
                                        <p:forEach items="${liste }" var = "rdv">
                                    <tbody>

                                        <tr>
                                            <td>${rdv.id_Rdv }</td>
                                            <td>${rdv.date_Rdv }</td>
                                            <td>${rdv.motif }</td>
                                            <td>${rdv.id_P }</td>

                                            <td>
                                            <a href="${pageContext.request.contextPath}/RDVController?action=supprimer&Id_Rdv=${rdv.id_Rdv }" onclick="confirmation()" > Supprimer</a>
                                            </td>

                                        </tr>

                                    </tbody>                                                                              
                                  </p:forEach>                                       
                            </table>

and this is my javascript code:

    function confirmation(){

    var result = confirm("vous êtes sûr ?");

    if(result){
        return true;
    }
    else{
        return false;
    }
}

Solution

You can use button instead of a tag and apply css to button so that it look like a tag. Here, in below code whenever you click on button pop up will open if click yes then directly the page will get redirect else page will stay on same page .

function confirmation(button) {
  //getting href value
  var href = button.getAttribute("href");
  console.log(href);
  var result = confirm("vous êtes sûr ?");

  if (result) {
    //if click yes redirect 
    window.location.href = href;
  } else {

    return false;
  }
}

.supprimer {
  background-color: transparent;
  text-decoration: underline;
  border: none;
  color: blue;
  cursor: pointer;
}

supprimer:focus {
  outline: none;
}

<table>
  <thead>
    <tr>
      <th>ID</th>
      <th>Date RDV</th>
      <th>Motif</th>
      <th>ID Patient</th>
      <th>Action</th>
    </tr>


  </thead>
  <p:forEach items="${liste }" var="rdv">
    <tbody>

      <tr>
        <td>${rdv.id_Rdv }</td>
        <td>${rdv.date_Rdv }</td>
        <td>${rdv.motif }</td>
        <td>${rdv.id_P }</td>

        <td>
          <button class="supprimer" href="${pageContext.request.contextPath}/RDVController?action=supprimer&Id_Rdv=${rdv.id_Rdv }" onclick="confirmation(this)"> Supprimer</button>

        </td>

      </tr>

    </tbody>
  </p:forEach>
</table>

Answered By - Swati