In this code snippets post I provided reusable Bootstrap Modal Dialog with code example.

Bootstrap JavaScript modal

Bootstrap JavaScript modal plugin you can use to add confirm dialogs, user notifications, or completely custom popup content.

Reusable bootstrap confirm box

Add following html code in your shared layout view

<!-- Modal -->
   <div class="modal fade" id="bsModal" tabindex="-1" role="dialog" aria-labelledby="bsModalLabel" aria-hidden="true">
      <div class="modal-dialog" role="document">
       <div class="modal-content">
     <div class="modal-header">
   <h5 class="modal-title" id="exampleModalLabel">Confirm message</h5>
  <button type="button" id="btnClose" class="close" data-dismiss="modal" aria-label="Close">
           <span aria-hidden="true">&times;</span>
          </button>
       </div>
    <div id="confirmMsg" class="modal-body">
     
     </div>
  <div class="modal-footer">
 <button type="button" id="btnCancel" class="btn
btn-warning" data dismiss="modal">Cancel</button>
<button type="button" id="btnOk"  class="btn btn-success">Ok</button>
     </div>
       </div>
         </div>
          </div> 

jQuery reusable model confirms box code to perform actions like delete, update, reject etc

Button Delete, Update, Reject events

//Perform delete 
$("#btnDelete").click(function (e)
{ 
 //Delete product on confrim ok click
  BsConfirmModel("Are you sure you wish to delete?", "Delete", e);
});
 
//Perform update 
$("#btnUpdate").click(function (e) {
 //Update order on confrim ok click 
  BsConfirmModel("Are you sure you wish to update?", "Update", e);
});
 
//Perform Reject order
$("#btnReject").click(function (e) {
  //Reject order on confrim ok click   
  BsConfirmModel("Are you sure you wish to reject?", "Reject", e);
}); 

Reusable bootstrap confirm function

function BsConfirmModel(msg, actionType,event) {
    event.preventDefault();
    $("#confirmMsg").text(msg);
    $('#bsModel').modal({
        backdrop: 'static',
        keyboard: false
    });
 
    $("#bsModel").off('click').on('click', '#btnOk', function (e) {
        e.preventDefault();
        switch (actionType) {
            case 'Delete':
                //code block
                // Ajax call to delete
 
                break;
            case 'Update':
                //code block
                // Ajax call to update
                break;
            case 'Approve':
                //code block
                // Ajax call to approve order
                break;
            
            case 'Reject':
                //code block
                // Ajax call to reject order
                break;
 
            default:
                //code block
                //default ajax call
                break;
 
        }
        $('#bsModel').modal('hide');
        $('#bsModel').data('modal', null);
    });
 
    $("#btnCancel").off("click").on('click', function (e) {
        e.preventDefault();
        $('#bsModel').modal('hide');
        $('#bsModel').data("modal", null);
    });
 
    $("#btnClose").off("click").on("click", function (e) {
        e.preventDefault();
        $("#bsModel").modal("hide");
        $('#bsModel').data("modal", null);
    });
} 

 In this post i will explain in detail how to use bootstrap modal box as confirm dialog for delete or update action.  

Windows confirm

The confirm () method displays a dialog box with a specified message, along with an OK and a Cancel button.           

Problem with windows confirm

What if you want some nice design for windows confirm and want to apply CSS?

Windows confirm () alerts cannot be styled, they are generic to the browser.

What if someone wants to apply CSS to confirm box or nice design?

Answer is, use bootstrap model popup box.

How to use bootstrap confirm box for following .net MVC action?

 @Html.ActionLink("Delete", "Delete", new { id= item.id }, new { id = "btnDelete",
@class = "btn btn-sm", onclick = "return confirm('Are you sure you wish to delete?');" })

OR

<a href="@Url.Action("Update", "Products", new { ud= item.id })" id="btnUpdate" class="btn
btn-sm"  onclick="return confirm('Are you sure you wish to update?');" /> 

Bootstrap model box solution for windows confirm

Add following bootstrap model html code in shared layout or in same view

<!-- Modal -->
   <div class="modal fade" id="sampleModal" tabindex="-1" role="dialog" aria-labelledby="sampleModalLabel" aria-hidden="true">
      <div class="modal-dialog" role="document">
       <div class="modal-content">
     <div class="modal-header">
   <h5 class="modal-title" id="exampleModalLabel">Confirm</h5>
  <button type="button" id="btnClose" class="close" data-dismiss="modal" aria-label="Close">
           <span aria-hidden="true">&times;</span>
          </button>
       </div>
    <div id="confirmMsg" class="modal-body">
     
     </div>
  <div class="modal-footer">
 <button type="button" id="btnCancel" class="btn
btn-warning" data dismiss="modal">Cancel</button>
<button type="button" id="btnOk"  class="btn btn-success">Ok</button>
     </div>
       </div>
         </div>
          </div> 

Remove windows confirm onclick call

@Html.ActionLink("Delete", "Delete", new { id= item.id }, new { id = "btnDelete", @class = "btn btn-sm"})

OR

<a href="@Url.Action("Update", "Products", new { ud= item.id })" id="btnUpdate" class="btn btn-sm" />

Add bootstrap popup code in jQuery delete button Click event, same call you can create for edit action also

$("#btnDelete").click(function (event)
{
    var delhref = $(this).attr('href');
    var isOk = false;
    event.preventDefault();
    $("#confirmMsg").text("Are you sure you wish to delete?");
    $('#sampleModel').modal({
        backdrop: 'static',
        keyboard: false
    });
 
    $("#sampleModel").off("click").on("click", "#btnOk", function (e) {
        e.preventDefault();
        $('#sampleModel').modal("hide");
        $('#sampleModel').data("modal", null);
        isOk = true;
    });
 
    $("#btnCancel").off("click").on("click", function (e) {
        e.preventDefault();
        $("#sampleModel").modal("hide");
        $("#sampleModel").data("modal", null);
        isOk = false;
    });
 
    $("#btnClose").off("click").on("click", function (e) {
        e.preventDefault();
        $("#sampleModel").modal("hide");
        $('#sampleModel').data("modal", null);
        isOk = false;
    });
 
    $("#sampleModel").off("hidden.bs.modal").on("hidden.bs.modal", function (e) {
        e.preventDefault();
        if (isOk) {
            //here you require some customization in URl, change according to your requirement
           window.location.href = window.location.href + delhref;
        }
    })
    return isOk;
});

When confirm popup closes the hidden.bs.modal event fires multiple time, I added page update action but it calling multiple times.

$("#bsModel").on("hidden.bs.modal", function (e) {

        e.preventDefault();

    //isOk is set to true when ok button clicked

        if (isOk) {

           //Data update call when model closed

        }

    });