CODEWITHSUNDEEP
jquery
black bubbles
black bubbles

Reputation: 20

adding scroll in autocomplete in jQuery

I have a jQuery Code which is working fine but I want to add Scroll bar. This is my jQuery Code which is in working condition

<script>
  $(function() {
    var availableTags = [
      //my options
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  });
  </script>

html code is 

<div>
  <label for="tags">Tags: </label>
  <input id="tags">
</div>

I am new in jQuery I spend hours but couldn't fix it

Upvotes: 0

Views: 101

Answers (1)

Umm E Habiba Siddiqui
Umm E Habiba Siddiqui

Reputation: 594

add style before your <script> tag like this and fix the height of your autocomplete, it will show scroll if results don't fit in the specified height.

<style>
      .ui-autocomplete {
        max-height: 100px; // set whatever you want
        overflow-y: auto;
        overflow-x: hidden; //this will prevent horizontal scrollbar
      }
      * html .ui-autocomplete {
        height: 100px;
      }
      </style>

Upvotes: 1

Related Questions