0

入力値を入力するために getbootstrap typeahead を使用しています。ユーザーがこのリストから何かを選択する必要があるように、すべてをセットアップしました。

<input type="text" class="form-control" id="birdname" ng-model="birdname" required ng-disabled="checked" autocomplete="off" placeholder="Check the box if you don't know!" 
                uib-typeahead="bird for bird in birds | filter:$viewValue | limitTo:8" typeahead-no-results="noResults"
                uib-tooltip="Pick a bird or check the box if unsure!"
                tooltip-placement="top-right"
                tooltip-trigger="mouseenter"
                tooltip-enable="!birdname">
        </div>
        <div ng-show="noResults">
          <i class="glyphicon glyphicon-remove"></i> No Results Found - Please Try Again!
        </div>

ご覧のとおり、ユーザーはこのリストから何かを選択する必要があります。そうしないと、検証で許可されませんが、1 つの問題があります。ユーザーが入力を開始し、存在する鳥の名前を入力している場合 (入力時に鳥が表示されるリスト) 、しかし、マウスで入力からクリックします。完全な名前が選択されていなくても、typeahead はこれを「正しい」ものとして受け入れます。

これに対する修正はありますか?

私の言いたいことが理解できなかった場合は、次の図で説明できることを願っています。

エラー

これに対する解決策はありますか?たとえば、クリックするとリストの最初のオプションが選択されますか?

4

0 に答える 0