Tobias Bulten Kegel
Tobias Bulten Kegel

Reputation: 23

I need a popover in my modal with bootstrap 3.0.2

Hi my problem isthat the popover that shoud be in the model when toggled, are instead directing to the body behind the modal in the top left corner and not shown in the modal.

here is my index code:

<button type="button" id="example" class="btn btn-default" data-container="body" 
data-toggle="popover" data-placement="right" 
data-content="And here's some amazing     content" 
data-original-title="Hej" >
<img/>
</button>

The knouckoutbootstrap.js lookes like this:

$(function () {
$.ajaxSetup({ cache: false });

ko.bindingHandlers.showModal = {
    init: function (element, valueAccessor) {
    },
    update: function (element, valueAccessor) {
        var value = valueAccessor();
        if (ko.utils.unwrapObservable(value)) {
            $(element).removeData("modal").modal();
        }
        else {
            $(element).modal('hide');
        }
    }
};
$('#example').popover();
var lockerLoanViewModel = new LockerLoanViewModel();
ko.applyBindings(lockerLoanViewModel);
lockerLoanViewModel.initializeViewModel();
});

I don't know if its helpfull but here is the stylesheet:

body {
margin-top: 30px;
margin-left: 30px;
margin-right: 30px;
margin-bottom: 30px;
}

.gridContainer {
margin-top: 30px;
}
.popover {
z-index: 1060;
position: fixed;
display:inherit;
}

If you wanna ask me something pls do i really need help with this. (sorry for bad english :D )

Upvotes: 0

Views: 202

Answers (1)

Tobias Bulten Kegel
Tobias Bulten Kegel

Reputation: 23

thanks every one i fixed it my self the solution was that i changed the script to

$(function () {
$('.openModal').on('click', function (e) {
$('#editLockerModal')
    .modal({
    backdrop 'static',
    keyboard false
});

$('#example').popover();
});
var lockerLoanViewModel = new LockerLoanViewModel();
ko.applyBindings(lockerLoanViewModel);
lockerLoanViewModel.initializeViewModel();
});

Upvotes: 1

Related Questions