Comment afficher un message de confirmation avant de supprimer?

Écrivez ceci dans l'événement onclick du bouton:

 var result = confirm("Want to delete?"); if (result) { //Logic to delete the item } 

Vous pouvez utiliser mieux comme suit

  <a href="url_to_delete" onclick="return confirm('Are you sure you want to delete this item?');">Delete</a> 

C'est ainsi que vous le feriez avec un JavaScript discret et que le message de confirmation se trouve dans le code HTML.

 <a href="/delete" class="delete" data-confirm="Are you sure to delete this item?">Delete</a> 

Ceci est pure vanilla JS, compatible avec IE 9+:

 var deleteLinks = document.querySelectorAll('.delete'); for (var i = 0; i < deleteLinks.length; i++) { deleteLinks[i].addEventListener('click', function(event) { event.preventDefault(); var choice = confirm(this.getAttribute('data-confirm')); if (choice) { window.location.href = this.getAttribute('href'); } }); } 

Consultez-le en action: http://codepen.io/anon/pen/NqdKZq

 function ConfirmDelete() { var x = confirm("Are you sure you want to delete?"); if (x) return true; else return false; } <input type="button" Onclick="ConfirmDelete()"> 

Amélioration sur user1697128 (car je ne peux pas encore commenter)

 <script> function ConfirmDelete() { var x = confirm("Are you sure you want to delete?"); if (x) return true; else return false; } </script> <button Onclick="return ConfirmDelete();" type="submit" name="actiondelete" value="1"><img src="images/action_delete.png" alt="Delete"></button> 

Annulera la soumission du formulaire si l'annulation est pressée

Essaye ça. Ça marche pour moi

  <a href="delete_methode_link" onclick="return confirm('Are you sure you want to Remove?');">Remove</a> 

 <form onsubmit="return confirm('Are you sure?');" /> 

Fonctionne bien pour les formulaires. Question spécifique à la forme: formulaire JavaScript – Confirmer ou annuler la boîte de dialogue de soumission

Si vous êtes intéressé par une solution rapide et jolie avec un format css, vous pouvez utiliser SweetAlert

 $(function(){ $(".delete").click(function(){ swal({ title: "Are you sure?", text: "You will not be able to recover this imaginary file!", type: "warning", showCancelButton: true, confirmButtonColor: "#DD6B55", confirmButtonText: "Yes, delete it!", closeOnConfirm: false }, function(isConfirmed){ if(isConfirmed) { $(".file").addClass("isDeleted"); swal("Deleted!", "Your imaginary file has been deleted.", "success"); } } ); }); }); 

 html { zoom: 0.7 } /* little "hack" to make example visible in stackoverflow snippet preview */ body > p { font-size: 32px } .delete { cursor: pointer; color: #00A } .isDeleted { text-decoration:line-through } 

 <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script> <script src="http://t4t5.github.io/sweetalert/dist/sweetalert-dev.js"></script> <link rel="stylesheet" href="http://t4t5.github.io/sweetalert/dist/sweetalert.css"> <p class="file">File 1 <span class="delete">(delete)</span></p> 

HTML:

 <a href="#" class="delete" data-confirm="Are you sure to delete this item?">Delete</a> 

Utilisation de jQuery:

 $('.delete').on("click", function (e) { e.preventDefault(); var choice = confirm($(this).attr('data-confirm')); if (choice) { window.location.href = $(this).attr('href'); } }); 

 function del_confirm(msg,url) { if(confirm(msg)) { window.location.href=url } else { false; } } <a onclick="del_confirm('Are you Sure want to delete this record?','<filename>.php?action=delete&id=<?<id> >')"href="#"></a> 

Je sais que c'est vieux, mais j'avais besoin d'une réponse et non, mais la réponse d' alpesh m'a fonctionné et je voulais partager avec des gens qui pourraient avoir le même problème.

 <script> function confirmDelete(url) { if (confirm("Are you sure you want to delete this?")) { window.open(url); } else { false; } } </script> 

Version normale:

 <input type="button" name="delete" value="Delete" onClick="confirmDelete('delete.php?id=123&title=Hello')"> 

Ma version PHP:

 $deleteUrl = "delete.php?id=" .$id. "&title=" .$title; echo "<input type=\"button\" name=\"delete\" value=\"Delete\" onClick=\"confirmDelete('" .$deleteUrl. "')\"/>"; 

Ce n'est peut-être pas la bonne façon de le faire publiquement, mais cela a fonctionné pour moi sur un site privé. 🙂

Pour configurer un message de conformation lorsque vous supprimez quelque chose dans php & mysql …

Utilisez ce code de script:

 <script> function Conform_Delete() { return conform("Are You Sure Want to Delete?"); } </script> 

Utilisez ce code html:

 <a onclick="return Conform_Delete()" href="#">delete</a> 

Utilisation de jQuery:

 $(".delete-link").on("click", null, function(){ return confirm("Are you sure?"); }); 

 <SCRIPT LANGUAGE="javascript"> function Del() { var r=confirm("Are you sure?") if(r==true){return href;}else{return false;} } </SCRIPT> 

Votre lien pour cela:

 <a href='edit_post.php?id=$myrow[id]'> Delete</a> 

Le gestionnaire onclick doit renvoyer faux après l'appel de fonction. Par exemple,

onclick="ConfirmDelete(); return false;">

Je pense que la solution la plus simple et la plus discrète serait:

Lien:

 <a href="http://link_to_go_to_on_success" class="delete">Delete</a> 

Javascript:

 $('.delete').click(function () { return confirm("Are you sure?"); }); 

 <a href="javascript:;" onClick="if(confirm('Are you sure you want to delete this product')){del_product(id);}else{ }" class="btn btn-xs btn-danger btn-delete" title="Del Product">Delete Product</a> 

 function del_product(id){ $('.process').css('display','block'); $('.process').html('<img src="./images/loading.gif">'); $.ajax({ 'url':'./process.php?action=del_product&id='+id, 'type':"post", success: function(result){ info=JSON.parse(result); if(result.status==1){ setTimeout(function(){ $('.process').hide(); $('.tr_'+id).hide(); },3000); setTimeout(function(){ $('.process').html(result.notice); },1000); }else if(result.status==0){ setTimeout(function(){ $('.process').hide(); },3000); setTimeout(function(){ $('.process').html(result.notice); },1000); } } }); } 

 <a href="javascript:;" onClick="if(confirm('Are you sure you want to delete this product')){del_product(id);}else{ }" class="btn btn-xs btn-danger btn-delete" title="Del Product">Delete Product</a> function del_product(id){ $('.process').css('display','block'); $('.process').html('<img src="./images/loading.gif">'); $.ajax({ 'url':'./process.php?action=del_product&id='+id, 'type':"post", success: function(result){ info=JSON.parse(result); if(result.status==1){ setTimeout(function(){ $('.process').hide(); $('.tr_'+id).hide(); },3000); setTimeout(function(){ $('.process').html(result.notice); },1000); }else if(result.status==0){ setTimeout(function(){ $('.process').hide(); },3000); setTimeout(function(){ $('.process').html(result.notice); },1000); } } }); } 

Entraine toi

 <form name=myform> <input type=button value="Try it now" onClick="if(confirm('Format the hard disk?')) alert('You are very brave!'); else alert('A wise decision!')"> </form> 

Web Original:

http://www.javascripter.net/faq/confirm.htm

Voici un autre exemple simple dans JS pur en utilisant className et événement de liaison.

 var eraseable = document.getElementsByClassName("eraseable"); for (var i = 0; i < eraseable.length; i++) { eraseable[i].addEventListener('click', delFunction, false); //bind delFunction on click to eraseables } function delFunction(){ var msg = confirm("Are you sure?"); if (msg == true) { this.remove(); //remove the clicked element if confirmed } }; 

 <button class="eraseable"> <img class="eraseable" src="http://zelcs.com/wp-content/uploads/2013/02/stackoverflow-logo-dumpster.jpg" style="width:100px;height:auto;"> Delete me</button> <button class="eraseable"> <img class="eraseable" src="http://zelcs.com/wp-content/uploads/2013/02/stackoverflow-logo-dumpster.jpg" style="width:100px;height:auto;"> Delete me</button> <button class="eraseable"> <img class="eraseable" src="http://zelcs.com/wp-content/uploads/2013/02/stackoverflow-logo-dumpster.jpg" style="width:100px;height:auto;"> Delete me</button> 

 <script> function deleteItem() { var resp = confirm("Do you want to delete this item???"); if (resp == true) { //do something } else { //do something } } </script> 

Appeler cette fonction en utilisant onClick

Pour "message de confirmation sur la suppression", utilisez:

  $.ajax({ type: "POST", contentType: "application/json; charset=utf-8", url: "Searching.aspx/Delete_Student_Data", data: "{'StudentID': '" + studentID + "'}", dataType: "json", success: function (data) { alert("Delete StudentID Successfully"); return true; } 

Angularjs avec l'exemple de suppression Javascript

Code html

 <button ng-click="ConfirmDelete(single_play.play_id)" type="submit" name="actiondelete" value="1"><img src="images/remove.png" alt="Delete"></button> 

"Single_play.play_id" est n'importe quelle variable angularjs supposons que vous souhaitez passer n'importe quel paramètre pendant l'action de suppression

Code Angularjs dans le module de l'application

 $scope.ConfirmDelete = function(yy) { var x = confirm("Are you sure you want to delete?"); if (x) { // Action for press ok $http({ method : 'POST', url : 'sample.php', headers: {'Content-Type': 'application/x-www-form-urlencoded'}, data: $.param({ delete_play_id : yy}) }).then(function (response) { $scope.message = response.data; }); } else { //Action for cancel return false; } } 

 var x = confirm("Are you sure you want to send sms?"); if (x) return true; else return false; 

 function confirmDelete() { var r=confirm("Are you sure you want to delte this image"); if (r==true) { //User Pressed okay. Delete } else { //user pressed cancel. Do nothing } } <img src="deleteicon.png" onclick="confirmDelete()"> 

Vous voudrez peut-être transmettre certaines données avec confirmDelete pour déterminer quelle entrée doit être supprimée