newman
newman

Reputation: 424

Issue with title bootbox

Can anyone tell me how to fix it? Ihave the same title issue in the alert box.

bootbox.confirm({
    title: "Confirmation",
    message: "Are you sure you want to delete the selected items?",
    buttons: {
        confirm: {
             label: 'Yes',
             className: 'btn-success',
        },
        cancel: {
            label: 'No',
            className: 'btn-danger'
        }
    },
    callback: function (result) {
                    if (result == true) {
                        $("#delete").submit();
                    } 
                }
    });

enter image description here

Upvotes: 1

Views: 1735

Answers (2)

Vignesh Baskaran
Vignesh Baskaran

Reputation: 73

It is a version problem. If you are using boot-box v4.x then you need Bootstrap v5.x

So check with the version. enter image description here

If you cannot make the version compatible, Please follow the below code:

closeButton = $('.bootbox').find('.bootbox-close-button');
$('.bootbox').find('.modal-header').append(closeButton);

It rearranges the close button properly.

Upvotes: 0

Gerry
Gerry

Reputation: 409

You seem to have messed up some CSS.

Maybe you are using another library which is overwriting bootbox styles.

You can try the following to fix that particular issue:

.bootbox .modal-header h4 {
  float: none;
}

.bootbox .modal-header .close {
  position: absolute;
  right: 15px;
}

Upvotes: 1

Related Questions