How to set scroll bar in datalist using bootstrap or js ?

Question

I am using meteor to develop my app. I want to set scroll bar in my datalist so that all the data show as scroll goes down. It will be better if i can set it using bootstrap. other method will also be good.

My code where i want to set scroll bar is :

<div class="form-group row ">
<div class="col-xs-12 ">
    <div class="form-group row ">
        <div class="dropdown col-xs-12">
          <input list="d1" id="search" name="d1" class="form-control input-xs" placeholder="Search by">
            <datalist id="d1">
              {{#each searched_val}}
            <option class="form-control" value="{{this}}"> {{this}} </option>
             {{/each}}
           </datalist>
        </div>
    </div>
</div>

Answer 1

you can set height and overflow as:

 <datalist id="d1" style="overflow-y:scroll;height:500px">
     {{#each searched_val}}
     <option class="form-control" value="{{this}}"> {{this}} </option>
      {{/each}}
  </datalist>