1. ホーム
  2. jquery

ブートストラップ・モーダルへのオートコンプリート問題

2023-12-08 15:14:59

質問

モーダルダイアログbootstrap内のjQuery autocompleteで表示に問題があります。

マウススクロールすると、結果が入力にくっついたままになりません。

これを解決する方法はありますか?

ここで JsFiddle :

.ui-autocomplete-input {
  border: none; 
  font-size: 14px;
  width: 300px;
  height: 24px;
  margin-bottom: 5px;
  padding-top: 2px;
  border: 1px solid #DDD !important;
  padding-top: 0px !important;
  z-index: 1511;
  position: relative;
}

EDIT 問題が見つかりました。

.ui-autocomplete {
  position: fixed;
  .....
}

モーダルがスクロールする場合、問題は残ります!

ここで JsFiddle/1 .

どのように解決するのですか?

位置は、quot;absolute" で正しいのですが、オプションとして オートコンプリート :

$( ".addresspicker" ).autocomplete( "option", "appendTo", ".eventInsForm" );

結果を表示するボックスを任意の要素に固定することができるところ、フォームのクラスに固定されるのを止めなければなりません。

ここで は動いているJsFiddleです! .