如何在提交前添加确认框

Question

I am a new developer and I have a problem. I think you can solve this. I want to show confirm box before delete. How Can I do that this my Ajax code 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;?>');">

ajax

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

Try with confirm Method

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