हटाने से पहले पुष्टि संदेश कैसे दिखाएं?

Question

मैं हटाने पर क्लिक करके एक पुष्टिकरण संदेश प्राप्त करना चाहता हूं (यह शायद एक बटन या एक छवि है)। यदि उपयोगकर्ता ' Ok' का चयन करता है तो हटा दिया जाता है, अन्यथा यदि Cancelक्लिक किया जाता है तो कुछ नहीं होता है।

जब बटन क्लिक किया गया था तो मैंने इसे गूँजने की कोशिश की थी, लेकिन गूंजने से मेरे इनपुट बॉक्स और टेक्स्ट बॉक्स अपनी शैली और डिज़ाइन खो देते हैं।

Answer 1

onclickबटन की स्थिति में इसे लिखें :

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

Comments

शानदार जवाब! कम, सटीक और कुशलता से काम करता है

— जॉन

किसी भी गैर-अनुभव वाले जावास्क्रिप्ट व्यक्ति के लिए, आपकी कोड लाइनों का मतलब कुछ भी नहीं है, उदाहरण अनिर्णायक और भ्रमित दिखता है। बहरहाल, यह एक अच्छा जवाब है।

— सैमुअल रमजान

मुझे लगता है कि आपको अपने उत्तर में कुछ विवरण जोड़ना चाहिए। आप इसे हेड सेक्शन में या किसी बाहरी फाइल में लिखने के बजाय बटन के अंदर कोड क्यों डालते हैं? यह एक बहुत ही सामान्य कार्य है और प्रोग्रामर इसे कई बार कई बटन के लिए उपयोग करना चाह सकता है, मैं इसे एक विशिष्ट बटन के अंदर नहीं लिखूंगा ...

— franz1

Answer 2

आप निम्नानुसार बेहतर उपयोग कर सकते हैं

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

Comments

यह थ्रेड में ऊपर होना चाहिए। सरल, तेज, प्रभावी। काम पूरी तरह से करता है।

— डॉनएक्सो

बहूत खतरनाक! क्या होगा यदि जावास्क्रिप्ट बंद कर दिया गया है? या अगर एक मकड़ी / खोज बॉट इस पृष्ठ को पढ़ेगी? यह तब सभी लिंक का पालन करेगा और सब कुछ हटा देगा! कुछ ब्राउज़र प्लगइन्स इसे प्री-कैश करने के लिए एक पेज पर सभी लिंक का अनुसरण करते हैं। कभी इस तरह से करो! हटाएं कभी भी GET अनुरोध नहीं होनी चाहिए।

— डेनियल टेस्टा

यह # 1 अप बोटेड उत्तर से कम खतरनाक नहीं है, यदि जावास्क्रिप्ट को बंद कर दिया गया है तो कोई भी जावास्क्रिप्ट खतरनाक है। जावास्क्रिप्ट को चालू या बंद किया जाना एक उपयोगकर्ता की व्यक्तिगत पसंद है, यदि जावास्क्रिप्ट को बंद कर दिया जाता है, तो उपयोगकर्ता को किसी भी वेबसाइट पर किसी भी बटन को नहीं धकेलना बेहतर पता होना चाहिए। हमेशा एक अद्भुत विकल्प के रूप में सर्वर साइड सत्यापन होता है।

— शमूएल रमजान

Answer 3

यह है कि आप इसे विनीत जावास्क्रिप्ट और HTML में पुष्टिकरण संदेश के साथ कैसे करेंगे।

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

यह शुद्ध वेनिला JS है, 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');
      }
  });
}

इसे क्रिया में देखें: http://codepen.io/anon/pen/NqdKZq

Comments

यह पूरी तरह से काम करता है, लेकिन केवल पहले बटन के लिए काम करता है। क्या होगा अगर हमारे पास 20 या उससे अधिक पसंद हैं? धन्यवाद!

— भावुकता

आप सही हैं, यह केवल प्रथम तत्व से मेल खाने वाले क्वेरीसेलर के कारण है। मैंने उत्तर संपादित किया है और इसके बजाय querySelectorAll का उपयोग करने के लिए कोडपेन को फोर्क किया है।

— देवनाटाइन

अगर यह उदाहरण जावास्क्रिप्ट अक्षम के साथ काम करने के लिए संपादित किया गया था, तो अच्छा होगा, उदाहरण के href="https://stackoverflow.com/delete"लिए मुझे लगता है कि पर्याप्त होगा। या एक फॉर्म सबमिट उदाहरण।

— सिरो सेंटिल्ली 郝海东 冠状 iro i 法轮功 '

@CiroSantilli 巴拿馬 文件 ill ill the यह पहले से ही इस घटना के लिए धन्यवाद है ।preventDefault () फ़ंक्शन। आप हैश चार्ट को url से बदल सकते हैं, यह ट्रिगर नहीं होगा। लेकिन, यदि जावास्क्रिप्ट को निष्क्रिय किया जाता है तो लिंक उम्मीद के मुताबिक काम करेगा।

— देवनाटाइन

@CiroSantilli 巴拿馬 文件 事件 法轮功 you यहाँ तुम जाओ;)

— DevAntoine

Answer 4

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


<input type="button" onclick="ConfirmDelete()">

Comments

मुझे लगता है कि केवल 1 रिटर्न प्वाइंट होना बेहतर है। इसलिए मैं पसंद करता हूं

— जेडी

या बस return confirm("…")। एक चर को असाइन करने की आवश्यकता नहीं है जो बूलियन है और फिर अगर / में शाखा।

— slhck

Answer 5

इसे इस्तेमाल करे। इससे मेरा काम बनता है

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

Comments

सुंदर और कुशल।

— शमूएल रमज़ान

Answer 6

यह बहुत सरल है और कोड की एक पंक्ति है

<a href="#" title="delete" class="delete" onclick="return confirm('Are you sure you want to delete this item')">Delete</a>

Comments

ऐसा लगता है कि स्वीकार किए गए एवर के ठीक नीचे इस तरह का जवाब पहले से ही है।

— हैट

Answer 7

user1697128 पर सुधार (क्योंकि मैं अभी तक इस पर टिप्पणी नहीं कर सकता)

<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>

यदि निरस्त किया गया है तो फॉर्म जमा रद्द कर देगा

Answer 8

मैं यह करने का तरीका प्रस्तुत करना चाहूंगा:

<form action="/route" method="POST">
<input type="hidden" name="_method" value="DELETE"> 
<input type="hidden" name="_token" value="the_token">
<button type="submit" class="btn btn-link" onclick="if (!confirm('Are you sure?')) { return false }"><span>Delete</span></button>
</form>

Answer 9

एचटीएमएल

<input onclick="return myConfirm();" type="submit" name="deleteYear" class="btn btn-danger" value="Delete">

जावास्क्रिप्ट

<script>
function myConfirm() {
  var result = confirm("Want to delete?");
  if (result==true) {
   return true;
  } else {
   return false;
  }
}

Answer 10

HTML:

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

JQuery का उपयोग करना:

$('.delete').on("click", function (e) {
    e.preventDefault();

    var choice = confirm($(this).attr('data-confirm'));

    if (choice) {
        window.location.href = $(this).attr('href');
    }
});

Comments

DevAntoines उत्तर का एक अच्छा jQuery अनुकूलन ( stackoverflow.com/a/19973570/1337887 )। हालांकि, थोड़ा अधिक सामान्यीकृत दृष्टिकोण "$ ('हटाएं') के बजाय" $ ('ए [डेटा-पुष्टि]') का उपयोग करना होगा। " इस तरह, आपको हटाए जाने वाले वर्ग के लिए बटन की आवश्यकता नहीं है, बल्कि इसके बजाय डेटा-पुष्टि विशेषता को एकीकृत करें।

— फ्लोरियन

Answer 11

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

रूपों के लिए अच्छी तरह से काम करता है। फॉर्म-विशिष्ट प्रश्न: जावास्क्रिप्ट फॉर्म सबमिट करें - सबमिट डायलॉग बॉक्स की पुष्टि या रद्द करें

Answer 12

<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>

<!-- language: lang-js -->
<script>
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);
            }
        }
    });
}
</script>

Answer 13

अभ्यास

<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>

वेब मूल:

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

Answer 14

यदि आप सीएसएस प्रारूप के साथ कुछ त्वरित सुंदर समाधान में रुचि रखते हैं, तो आप 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>

Answer 15

जब आप php और mysql में कुछ हटाते हैं, तो एक संदेश भेजने के लिए ...

इस स्क्रिप्ट कोड का उपयोग करें:

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

इस HTML कोड का उपयोग करें:

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

Answer 16

var txt;
var r = confirm("Press a button!");
if (r == true) {
   txt = "You pressed OK!";
} else {
   txt = "You pressed Cancel!";
}

var txt;
var r = confirm("Press a button!");
if (r == true) {
    txt = "You pressed OK!";
} else {
    txt = "You pressed Cancel!";
}

Answer 17

JQuery का उपयोग करना:

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

Answer 18

मुझे पता है कि यह पुराना है, लेकिन मुझे इनके उत्तर और गैर की आवश्यकता थी, लेकिन अल्पेश के उत्तर ने मेरे लिए काम किया और मैं उन लोगों के साथ साझा करना चाहता था जिनकी समस्या समान थी।

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

सामान्य संस्करण:

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

मेरा PHP संस्करण:

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

यह सार्वजनिक रूप से करने का सही तरीका नहीं हो सकता है, लेकिन यह मेरे लिए एक निजी साइट पर काम करता है। :)

Answer 19

यह बहुत सरल है

function archiveRemove(any) {
    var click = $(any);
    var id = click.attr("id");
    swal.fire({
        title: 'Are you sure !',
           text: "?????",
           type: 'warning',
           showCancelButton: true,
           confirmButtonColor: '#3085d6',
           cancelButtonColor: '#d33',
           confirmButtonText: 'yes!',
           cancelButtonText: 'no'
    }).then(function (success) {
        if (success) {
            $('a[id="' + id + '"]').parents(".archiveItem").submit();
        }
    })
}

Answer 20

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>

Answer 21

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

इसके लिए आपका लिंक:

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

Answer 22

फ़ंक्शन कॉल के बाद ऑन्कलिक हैंडलर को गलत वापस लौटना चाहिए। उदाहरण के लिए।

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

Answer 23

मुझे लगता है कि सबसे सरल विनीत समाधान होगा:

संपर्क:

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

जावास्क्रिप्ट:

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

Answer 24

<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);

                }
            }
        });
}

Answer 25

यहाँ शुद्ध जेएस में एक और सरल उदाहरण है जो क्लासनेम और इसे बाइंडिंग इवेंट का उपयोग करता है।

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>

Answer 26

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

इस फ़ंक्शन का उपयोग करके कॉल करें onClick

Answer 27

"हटाए जाने पर पुष्टि संदेश" उपयोग के लिए:

                       $.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;
                        }

Answer 28

जावास्क्रिप्ट हटाएँ उदाहरण के साथ कोणीय

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" कोई भी एंगुलरज वैरिएबल है मान लीजिए आप डिलीट एक्शन के दौरान किसी भी पैरामीटर को पास करना चाहते हैं

ऐप मॉड्यूल के अंदर Angularjs कोड

$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;
            }
        } 

Answer 29

यह विकल्प बॉक्स के लिए करना बहुत कठिन है। यहाँ समाधान है:

<select onchange="if (this.value == 'delete' && !confirm('THIS ACTION WILL DELETE IT!\n\nAre you sure?')){this.value=''}">
    <option value=''> &nbsp; </option>
    <option value="delete">Delete Everything</option>
</select>

Answer 30

मैं इस तरह से उपयोग कर रहा हूँ (लार्वा में) -

<form id="delete-{{$category->id}}" action="{{route('category.destroy',$category->id)}}" style="display: none;" method="POST">
 @csrf
 @method('DELETE')
</form>

<a href="#" onclick="if (confirm('Are you sure want to delete this item?')) {
           event.preventDefault();
           document.getElementById('delete-{{$category->id}}').submit();
         }else{
           event.preventDefault();
         }">
  <i class="fa fa-trash"></i>
</a>