форму в popover не работает

Question

Я использую bootstrap, и я хочу создать форму в popover. Я сделал это, но я не могу ввести текстовое поле формы. Кто-нибудь знает, почему?

* обновление Это внутри модальное. Вне модального он работает, но внутри него нет ...

* update2 Практически там я думаю. Когда я открываю modal и popover, я не могу вводить текстовое поле. После того, как я закрываю modal, popover все еще открыт, а затем я могу ввести текстовое поле. Таким образом, между текстовым полем и всплывающим окном должен быть некоторый z-индекс. Реальный неаккуратно, но я попытался input{z-index:9999;}, но это не сработало

<a href="#" class="add_nr" data-nummer-id="nr_1" rel="popover"> 


<div id="add_number" class="popover"> 
    <div class="addnr" id="nr_1"> 
     <form class="form-inline"> 
      <div class="controls"> 
       <input type="text" placeholder="Artist"> 
      </div> 
      <div class="controls"> 
       <input type="text" placeholder="Number"> 
      </div> 
      <a href="#">cancel</a> 
      <button type="submit" class="btn">add number</button> 
     </form> 
    </div> 
</div> 




$(function(){ 
     $('.add_nr').on('click', function(event){ 
      var $this = $(this); 
      event.preventDefault(); 
      $('.add_nr').not($this).popover('hide'); 
      $this.popover('show'); 

     }).popover({ 
      trigger: 'manual', 
      placement: 'bottom', 
      content: function(e) { 
       var $this = $(this), 
       nr_id = $this.data('nummer-id'); 
       return $('#' + nr_id + '.addnr').html(); 
      } 
     }) 
    }); 

Answer 1

Когда модальный запускается она сохраняет фокус на себя, предотвращая элементы в форме от получения фокуса. Простым решением было бы отключить слушателя при запуске модального запуска:

$('body').on('shown','.modal', function() { 
    $(document).off('focusin.modal') 
});