Блог

Я пытаюсь выполнить всплывающее окно с помощью bootstrap и сохранить существующее форматирование div.

Как я могу исправить приведенный ниже код, чтобы он заработал.

  <ul class="list-group" data-bind="foreach: courses">
  <li class="list-group-item CourseHover" data-bind="css: { hidden : isSatisfied}" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">
    <a tabindex="0" class="" role="button" data-toggle="popover" data-trigger="focus" title="Dismissible popover" data-content="And here's some amazing content. It's very engaging. Right?">
          <div class="row">
               <div class="col-sm-10">
                   <span data-bind="text:courseName"></span>
               </div>
               <div class="col-sm-2">
                   <span data-bind="text:courseCredits"></span> cr
               </div>
          </div>
    </a>
 </li>
  

Всплывающие окна должны быть инициализированы jquery.

Этот код должен сделать свое дело:

 $(function() {
  $('[data-toggle="popover"]').popover()
})
  

Вы также можете захотеть поместить data-placement=»bottom» или data-placement = «top» в свой тег привязки — всплывающее окно в противном случае может отображаться справа.