提出する前に確認ボックスを追加するには

Question

私は新しい開発者であり、問​​題があります。私はあなたがこれを解決できると思います。削除の前に確認ボックスを表示したい。どのように私はこの私のAjaxコード HTMLことを行うことができます。

<input type='button' class="btn btn-danger delete_button" id="delete_button<?php echo $row->id;?>" value="delete" onclick="delete_row('<?php echo $row->id;?>');"> 

アヤックス

function delete_row(id) 
{ 
jQuery.ajax({ 
    type:'post', 
    url: "/blue_bucket/wp-admin/admin-ajax.php?action=delete_form", 
    data:{ 
      delete_row:'delete_row', 
      row_id:id, 
     }, 
    success:function(response) { 
     if(response=="success") 
     { 
      var row=document.getElementById("row"+id); 
      row.parentNode.removeChild(row); 
     } 
     top.location.href="admin.php?page=data_list"; 
    } 
}); 
} 

WordpressのPHP

function delete_form() 
    { 
     if(isset($_POST['delete_row']))   
     { 
      $id=$_POST['row_id']; 
      echo $row_no; 
      global $wpdb; 
      $table_name = "countries"; 
      $wpdb->delete($table_name, 
         array('id' => $id)); 
      exit(); 
     }  
    } 

add_action('wp_ajax_delete_form', 'delete_form'); 
add_action('wp_ajax_nopriv_delete_form', 'delete_form'); 

Answer 1

がconfirm方法で試してみてください

function delete_row(id) 
{ 
if(!confirm('Are you sure to delet')){ 
return false; 
} 
jQuery.ajax({ 
    type:'post', 
    url: "/blue_bucket/wp-admin/admin-ajax.php?action=delete_form", 
    data:{ 
      delete_row:'delete_row', 
      row_id:id, 
     }, 
    success:function(response) { 
     if(response=="success") 
      { 
      var row=document.getElementById("row"+id); 
      row.parentNode.removeChild(row); 
      } 
      top.location.href="admin.php?page=data_list"; 
    } 
}); 
} 

Answer 2

あなたは参照コード

function delete_row(id) 
{ 
if (confirm("Do you want to delete?") == true) { 
jQuery.ajax({ 
    type:'post', 
    url: "/blue_bucket/wp-admin/admin-ajax.php?action=delete_form", 
    data:{ 
      delete_row:'delete_row', 
      row_id:id, 
     }, 
    success:function(response) { 
     if(response=="success") 
      { 
      var row=document.getElementById("row"+id); 
      row.parentNode.removeChild(row); 
      } 
      top.location.href="admin.php?page=data_list"; 
    } 
}); 
} 
} 

Answer 3

の下に、AJAX呼び出しの前にconfirmboxを置くことができる）（あなたのdelete_rowへの最初の行としてこれを追加します。

if(confirm('Are you sure you want to delete?')) { // code inside this... } 

Answer 4

は、このコードIを見てください持っている： https://github.com/delboy1978uk/bs-delete-confirm

あなたのプロジェクトでブートストラップを使用している場合（EDIT - 私は気付いただけです！ :-D）は、README.mdに従ってください！必要なのは、確認モーダルに接続するボタンにクラスを追加するだけです。ない場合は、実際のコードを見て、そして何にHTMLを微調整、およびJavaScriptコールまたはポップアップダイアログ編集：AJAXリクエストを送信する前に

(function($) { 
    $.fn.extend({ 
     deleteConfirm: function(options) 
     { 
      var defaults = 
      { 
       heading: "Please confirm", 
       body: 'Are you sure you wish to perform this action?', 
       ok_text: 'Proceed', 
       cancel_text: 'Back', 
       log: false 
      }; 

      options = $.extend(defaults,options); 

      $('body').append('<div class="modal fade" id="bs-delete-confirm" tabindex="-1" role="dialog" aria-labelledby="bs-delete-confirm-label" aria-hidden="true"><div class="modal-dialog"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button><h4 class="modal-title" id="bs-delete-confirm-label">Please confirm</h4></div><div id="bs-delete-confirm-body" class="modal-body"></div><div class="modal-footer"><a id="bs-delete-confirm-cancel" class="btn btn-default" data-dismiss="modal" aria-hidden="true"></a><a id="bs-delete-confirm-ok" class="btn btn-primary"></a></div></div></div></div>'); 

      $('#bs-delete-confirm-label').html(options.heading); 
      $('#bs-delete-confirm-body').html(options.body); 
      $('#bs-delete-confirm-cancel').html(options.cancel_text); 
      $('#bs-delete-confirm-ok').html(options.ok_text); 

      this.each(function() { 
       $(this).on('click',function(e){ 
        e.preventDefault(); 
        link = $(this).prop('href'); 
        $('#bs-delete-confirm-ok').prop('href',link); 
        $('#bs-delete-confirm').modal(); 
        if(options.log == true){ 
         console.log('Clicked link = ' + link); 
        } 
       }); 
      }); 
     } 
    }); 
})(jQuery);