0

HTML のスニペット:

<h:panelGrid width="100%">
  <h:outputText value="From:"></h:outputText>
  <h:inputText id="departureAirport" value="#{searchFlightsBean.departureAirport}" styleClass="input-block-level blue-highlight" placeholder="Enter departure city" required="true">
    <f:validateLength minimum="3" maximum="20" />
  </h:inputText>
  <h:message for="departureAirport" styleClass="alert alert-error" />
</h:panelGrid>

最終的には、AJAX を介してこのフィールドのデータを取得し、ユーザーが入力しているときにオプションを提案したいと考えています。

私は私のページに以下を含めました:

<h:outputStylesheet name="css/bootstrap.css" />
<h:outputStylesheet name="css/main.css" />
<h:outputScript name="js/jquery-2.0.2.min.js" />
<h:outputScript name="js/bootstrap-typeahead.js" />

そして、オートコンプリートをテストするために使用している次の JS があります。

$(document).ready(function () {
  $('#departureAirport').typeahead([ {
    name: 'planets',
    local: [ "Mercury", "Venus", "Earth", "Mars", "Jupiter", "Saturn", "Uranus", "Neptune" ]
  }]);
});

オートコンプリートが機能していません。正確に理由を知っている人はいますか?誰かが興味を持っている場合は、ここで先行入力の例を入手しました。

4

1 に答える 1

0

JSF と twitter-bootstrap はうまく連携していないようです。通常の入力フィールドで動作するようになりました。

于 2013-08-08T12:06:14.527 に答える