Hi I have a website with a search function and I would like to have the results displayed like the google search, so that the results show directly below the search bar. The screenshot shows the idea:
My the html for my search bar looks as follows:
<form class="user-search-form form-inline" action="{% url 'user-search' %}" method="POST">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="basic-addon1">@</span>
</div>
{% csrf_token %}
<input id="user_search" type="text" name="input" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1">
</div>
<ul class="list-group" id="results">
{% include 'feed/user_search.html' %}
</ul>
</form>
Right now my results are displayed within the navbar which is not looking very good imo. How can I have it like in the google search? (Does not have to be an exact clone but something like that :D)