HTML AJAX標籤insinde一個模式

Question

我有一個模式這個簡單的模式：

<div id="mod-quicksend" tabindex="-1" role="dialog" class="modal fade"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" data-dismiss="modal" aria-hidden="true" class="close">×</button> 
      </div> 
      <div class="modal-body"> 
       <div class="text-center"> 
        <h4>Selecciona un correo electronico: </h4> 
        <div class="row"> 
         <form id="modal-form-close" method="post"> 
          <input type="text" hidden value="quicksendquote" name="type"> 
          <input type="text" hidden value="{{ $quote->id }}" name="id"> 
          <div class="form-horizontal"> 
           <div class="col-sm-12 col-sm-offset-4"> 
            <div class="input-group"> 
             <select class="form-control" name="email[select]"> 
              <option></option> 
              @foreach($quote->Customer->Contacts as $key) 
               <option value="{{ $key->email }}">{{$key->email}}</option> 
              @endforeach 
             </select> 
            </div> 
           </div> 
           <h2>ó</h2> 
           <h3>digita un correo electronico:</h3> 
           <div class="row"> 
            <div class="form-horizontal"> 
             <div class="col-sm-12 col-sm-offset-4"> 

              <div class="input-group"> 
               <input type="text" name="email[type]" class="form-control" id="getEmail" autocomplete="off" > 
              </div> 

             </div> 
            </div> 
           </div> 
          </div> 
         </form> 
        </div> 
       </div> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" data-dismiss="modal" class="btn btn-default">Cerrar</button> 
       <button type="button" id="submit" data-dismiss="modal" class="btn btn-success">Aceptar</button> 
      </div> 
     </div><!-- /.modal-content--> 
    </div><!-- /.modal-dialog--> 
</div><!-- /.modal-end--> 

，這是JS代碼：

$('#getEmail').autocomplete({ 
    source: function (request, response) { 
     $.ajax({ 
      url: '{{ URL::to('/ajax') }}', 
      dataType: "json", 
      method: 'post', 
      data: { 
       name_startsWith: request.term, 
       type: 'getEmail' 
      }, 
      success: function (data) { 
       response($.map(data, function (item) { 
        var code = item.split("|"); 
        return { 
         label: "this is a label", 
         value: code[0], 
         data: item 
        } 
       })); 
      } 
     }); 
    }, 
    autoFocus: true, 
    minLength: 1, 
    select: function (event, ui) { 
     var names = ui.item.data.split("|"); 
     $(this).val(names[0]); 
    } 
}); 

我的問題是，當開始在輸入框中輸入標籤不會顯示在模式內，我可以在firebug上看到ajax請求是成功的，如果我將輸入框放在模式外部，標籤顯示正常，我甚至會硬編碼「這是標籤」測試，但仍然沒有骰子。

任何想法？

UPDATE：

我相信標籤下方顯示的模式對話框，請參見下面的例子：

https://jsfiddle.net/5qewtgcr/注意:::::您需要點擊的jsfiddle的標籤，以顯示下方運行爲什麼？我不知道，也許jsfiddle有問題或我的瀏覽器。

Answer 1

終於找到了答案：

.ui-autocomplete 
{ 
z-index: 99999; //Maximum and top of everything (not absolutely :|) 
} 

明白了來自：JQuery UI autocomplete for content in bootstrap modal

jsfiddle：https://jsfiddle.net/5qewtgcr/2/

Answer 2

我已更新你的小提琴。這裏是更新的小提琴，請檢查一下https://jsfiddle.net/5qewtgcr/1/

我在autocompletediv標籤添加HTML類：這裏是jQuery代碼：

$('#getEmail').autocomplete({ 
    source: function(request, response) { 
    $.ajax({ 
     url: 'echo', 
     dataType: "json", 
     method: 'post', 
     data: { 
     name_startsWith: request.term, 
     type: 'getEmail' 
     }, 
     success: function(data) { 
     response($.map(data, function(item) { 
      var code = item.split("|"); 
      return $(document).find('.input-group-text').append("this is a label" +item + code[0]); 
      /*{ 
      label: "this is a labelxysxysyxsyxsyxysxysxysyxsyxysxysyxsyxysxysyxsyxysyxysxysyxsyxysxysyxsyxy", 
      value: code[0], 
      data: item 
      }*/ 

     })); 
     } 
    }); 
    }, 
    autoFocus: true, 
    minLength: 1, 
    select: function(event, ui) { 
    var names = ui.item.data.split("|"); 
    $(this).val(names[0]); 
    } 
});