在自动填充字段上方添加标头？

I would like to have a fixed header above the results shown for the autocomplete field which categories which part the result is from? The dropdown may not be a google data dropdown, it could be a normal autocomplete with a fixed header inserted.

May I know, how can I do it? Anyone can help me?

Code:

<script>

function initialize() {

    map = new google.maps.places.Autocomplete(

    (document.getElementById('add')), {
        types: ['code']

    });   
}
</script>
<label>Address</label>
   <div class="col-md-4">
   <div class="input-group">
     {!! Form::hidden('pickup_lat', old('pickup_lat'), ["class" => "form-control"]) !!}
      {!! Form::hidden('lon', old('lat')!!}
     {!! Form::text('pickup_address', old('add'), "id" => "add"]) !!}
</div>
</div>

Output:

I had tried :

http://jsfiddle.net/ud3sh/v2Agq/4/

but it just shows the autocomplete result without the header

I don't think that Google supports this feature. If you check the Places search box guide and sample you will see that there's no such thing.

However you are always free to make your own implementation out of your own toolbox.