Bootstrap multiple modals modal-backdrop issue

Question

I have a page where one Bootstrap modal opens another modal.

The problem is that with each opened modal, it adds

Answer 1

// Make sure only one backdrop is rendered 
 $(document).on('show.bs.modal', '.modal', function () {
        if ($(".modal-backdrop").length > 1) {
            $(".modal-backdrop").not(':first').remove();
        }
    });
    // Remove all backdrop on close
    $(document).on('hide.bs.modal', '.modal', function () {
        if ($(".modal-backdrop").length > 1) {
            $(".modal-backdrop").remove();
        }
    });