Bootstrap popover по определенному элементу

Question

Я пытаюсь открыть popover на форме, если выбран первый параметр («Ничего не выбран») при нажатии «Далее» в мастере. Я использую Bootstrap и Bootstrap Wizard.

Я уже получил popover для работы, но не так, как мне нужно. Я хочу, чтобы popover на теге <a>, но когда нажата кнопка «Далее», а не когда я нажимаю кнопку «Тест».

Надеюсь, я прояснился.

Вот что я пытался до сих пор:

HTML:

<div> 
    <a href="#" data-toggle="popover" id="warning" title="Hello" data-content="Bye!">Test</a> 
    <select class="form-control input-lg" id="some_id"> 
     <option value="0">Nothing selected</option> 
    </select> 
    <br> 
</div> 

Javascript:

$(document).ready(function() { 
    $('#rootwizard').bootstrapWizard({ 
     onNext: function (tab, navigation, index) { 
      $("#warning").popover({ 
      container: "body" 
      }) 
     } 
    }) 
}); 

Answer 1

Вы были некоторые ошибки в JavaScript, и вы не инициализирует поповер : $('[data-toggle="popover"]').popover();

Следующие работы

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"> 


<div> 
    <a href="#" data-toggle="popover" data-placement="bottom" id="warning" title="Hello" data-content="Bye!">Test</a> 
    <select class="form-control input-lg" id="some_id"> 
     <option value="0">Nothing selected</option> 
    </select> 
    <br> 
</div> 

<script src="http://code.jquery.com/jquery.js"></script> 
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap-wizard/1.2/jquery.bootstrap.wizard.js"></script> 
<script> 
$(document).ready(function() { 
    $('[data-toggle="popover"]').popover(); 
    $('#rootwizard').bootstrapWizard({ 
     onNext: function (tab, navigation, index) { 
      $("#warning").popover({ 
       container: "body" 
      }); 
     } 
    }); 
}); 
</script> 

Edit: добавлена ​​скрипка: http://jsfiddle.net/timgavin/4rwzsmgc/