Donate

Bootstrap Modal Black Background Not Closing After Form Is Submitted

Hello fellow developers!

Normally, when closing a Bootstrap Modal, the black background also disappear. However, if the closing of Bootstrap Modal is triggered by a close or button event fired from a "Yes" button of jQuery UI dialog the bootstrap dialog is closed but the black background of the bootstrap modal is still visible. The solution that I came up with is to close the modal dialog before the call to submit the form in the Yes callback function of the jQuery UI Dialog.
function fnOpenNormalDialog($form) {
 var form = $form;
 $('<div id="divConfirm"></div>').dialog({
  resizable: false,
  modal: false,
  title: "Confirm Shipping",
  height: 150,
  width: 350,
  open: function () {
   $(this).html("Confirm that this part is ready to be shipped?");
  },
  buttons: {
   "Yes": function () {
    $(this).dialog('close');
    Callback(true, form);
   },
   "No": function () {
    $(this).dialog('close');
    Callback(false, form);
   }
  }
 });

 $(".ui-dialog").css({
  zIndex: '1060',
  top: '100px'
 });
}

function Callback(value, form) {
 if (value) {
  var $form = form;
  
  //close the bootstrap modal before submitting the form
  $('#modal-return-navistar .close').click();
  
  $form.trigger('submit');            
 } 
}

Comments

Donate

Popular Posts From This Blog

WPF CRUD Application Using DataGrid, MVVM Pattern, Entity Framework, And C#.NET

How To Insert Or Add Emojis In Microsoft Teams Status Message

Bootstrap Modal In ASP.NET MVC With CRUD Operations