12

私はcodeigniterフレームワークを使用しており、ブートストラップのタイプアヘッドを使用していますが、すべて問題ありませんが、ブートストラップモーダル内に配置すると、ブートストラップのタイプアヘッドが機能しません。誰かが私を助けることができますか？お願いします。これは私のコードです

<a data-target="ajaxify" data-toggle="modal" href="<?php echo base_url()?>task/add_task" class="no-u quick-task">
    <h4>Task</h4>
    <span>This is a simple description</span>
 </a>

add_task コントローラー内で、ビュー task_view.php および task.js を呼び出しますが、ブートストラップ モーダル内で先行入力が機能していないようです。

これは task.js の内容です

$(document).ready(function(){
$("#assign_to").typeahead({
    source: [{value: 'Charlie'}, {value: 'Gudbergur'}]              
});
});

これは task_view.php の内容です: 単なるサンプルです。

<div id="ajaxx" class="modal hide fade">
<div class="modal-header">
  <a class="close" data-dismiss="modal">&times;</a>
  <!--Your title here -->
  <h3>Modal Heading</h3>

</div>
<div class="modal-body">
<form><input type="text" name="assign_to" id="assign_to" /></form>
</div>
<div class="modal-footer">
  <!--Your dont change the attributes only the value here -->
  <a href="#" id="n0" class="btn n0" data-dismiss="modal">Close</a>
  <a href="#" id="y1" class="btn btn-primary y1" data-submit="modal">Save</a>
</div>
4

5 に答える 5

20

モーダル div の上に表示するには、.typeahead に 1051 の z-index を配置する必要があります。

于 2012-04-19T13:25:21.103 に答える
5

編集bootstrap-typeahead.js：

  this.$menu.css({
    top: pos.top + pos.height,
    left: pos.left,
    'z-index': 9999 //maximum z-index
  })

最大の z-index を見つけます: http://archive.plugins.jquery.com/project/TopZIndex

于 2012-05-19T05:07:30.207 に答える
4

少し異なるバージョン固有の問題が発生しているかどうかはわかりませんが、ブートストラップ 2.3.2 を使用していて、どのバージョンの z-index も機能していませんでした。最終的に機能する別のソリューションを見つけました：

.modal-body{overflow-y: inherit;}

https://github.com/twbs/bootstrap/issues/1078にあり、 jgutixによる回答

于 2013-10-22T16:17:18.763 に答える
2

typehead-append-to-body="true" を必ず削除してください

https://github.com/angular-ui/bootstrap/issues/3262

于 2015-02-18T08:34:00.177 に答える