I want to hide all of my bootbox modals. I currently have 2 modal and after I click on Cancel, I want to hide the all other modals.

Here's my code:

$('#table-grid').delegate(".requestBill", "click", function () { // store the checked checkbox ticket_id into array 
const prop_id = $(this).data('prop_id');
bootbox.prompt({
  title: "Request Bill",
  inputType: 'textarea',
  placeholder: 'Enter Additional Message',
  value: 'I am requesting an RPT Bill.',
  buttons: {
    confirm: {
      label: 'Submit'
    },
    cancel: {
      label: 'Cancel',


    }
  },
  callback: function (result) {
    if (result == null) {
      $.toast({
              heading: 'Note',
              text: 'Cannot request bill without describing reason(s)',
              icon: 'error',
              loader: false,
              stack: false,
              position: 'top-center',
              allowToastClose: false,
              bgColor: '#f0ad4e',
              textColor: 'white',
            });
    } else if (result == "") {
      $.toast({
              heading: 'Note',
              text: 'Cannot request bill without describing reason(s)',
              icon: 'error',
              loader: false,
              stack: false,
              position: 'top-center',
              allowToastClose: false,
              bgColor: '#f0ad4e',
              textColor: 'white',
            });


    } else {
      var fd = new FormData();
      fd.append("prop_id", prop_id);
      fd.append("content", result);
      $.ajax({
        type: "POST",
        url: base_url + "Main_declaration/request_bill",
        data: fd,
        contentType: false,
        cache: false,
        processData: false,
        beforeSend: function () {
          $(".requestBill").attr('disabled', true)
        },
        success: function (data) {
          if (data.success == 1) {
            $.toast({
              heading: 'Success',
              text: data.message,
              icon: 'success',
              loader: true,
              stack: false,
              position: 'top-center',
              allowToastClose: false,
              bgColor: '#5cb85c',
              textColor: 'white',
            });
          } else {
            $.toast({
              heading: 'Note',
              text: data.message,
              icon: 'error',
              loader: false,
              stack: false,
              position: 'top-center',
              allowToastClose: false,
              bgColor: '#f0ad4e',
              textColor: 'white',
            });
          }
        }
      });
    }
  }
});

});

What would be the syntax to hide bootbox modals(All modals)?

I want to hide all of my bootbox modals. I currently have 2 modal and after I click on Cancel, I want to hide the all other modals.

Here's my code:

$('#table-grid').delegate(".requestBill", "click", function () { // store the checked checkbox ticket_id into array 
const prop_id = $(this).data('prop_id');
bootbox.prompt({
  title: "Request Bill",
  inputType: 'textarea',
  placeholder: 'Enter Additional Message',
  value: 'I am requesting an RPT Bill.',
  buttons: {
    confirm: {
      label: 'Submit'
    },
    cancel: {
      label: 'Cancel',


    }
  },
  callback: function (result) {
    if (result == null) {
      $.toast({
              heading: 'Note',
              text: 'Cannot request bill without describing reason(s)',
              icon: 'error',
              loader: false,
              stack: false,
              position: 'top-center',
              allowToastClose: false,
              bgColor: '#f0ad4e',
              textColor: 'white',
            });
    } else if (result == "") {
      $.toast({
              heading: 'Note',
              text: 'Cannot request bill without describing reason(s)',
              icon: 'error',
              loader: false,
              stack: false,
              position: 'top-center',
              allowToastClose: false,
              bgColor: '#f0ad4e',
              textColor: 'white',
            });


    } else {
      var fd = new FormData();
      fd.append("prop_id", prop_id);
      fd.append("content", result);
      $.ajax({
        type: "POST",
        url: base_url + "Main_declaration/request_bill",
        data: fd,
        contentType: false,
        cache: false,
        processData: false,
        beforeSend: function () {
          $(".requestBill").attr('disabled', true)
        },
        success: function (data) {
          if (data.success == 1) {
            $.toast({
              heading: 'Success',
              text: data.message,
              icon: 'success',
              loader: true,
              stack: false,
              position: 'top-center',
              allowToastClose: false,
              bgColor: '#5cb85c',
              textColor: 'white',
            });
          } else {
            $.toast({
              heading: 'Note',
              text: data.message,
              icon: 'error',
              loader: false,
              stack: false,
              position: 'top-center',
              allowToastClose: false,
              bgColor: '#f0ad4e',
              textColor: 'white',
            });
          }
        }
      });
    }
  }
});

});

What would be the syntax to hide bootbox modals(All modals)?

• javascript
• jquery
• bootbox

• Have you tried the Bootstap events? Maybe that works. – Louys Patrice Bessette Commented Jul 30, 2018 at 3:30
• bootbox.hideAll();. As noted in the documentation. – Tieson T. Commented Aug 4, 2018 at 5:18

2 Answers 2

You should use next method:

bootbox.hideAll();

Documentation reference: http://bootboxjs./documentation.html#bb-function-hideAll

$('.bootbox.modal').modal('hide') should do the trick for you