Search form improvements

This commit is contained in:
Jeremy Stretch 2017-03-29 14:22:27 -04:00
parent afdb24610d
commit d04436aa0a
4 changed files with 46 additions and 54 deletions

View File

@ -33,7 +33,7 @@ OBJ_TYPE_CHOICES = (
class SearchForm(BootstrapMixin, forms.Form): class SearchForm(BootstrapMixin, forms.Form):
q = forms.CharField( q = forms.CharField(
label='Query' label='Query', widget=forms.TextInput(attrs={'style': 'width: 350px'})
) )
obj_type = forms.ChoiceField( obj_type = forms.ChoiceField(
choices=OBJ_TYPE_CHOICES, required=False, label='Type' choices=OBJ_TYPE_CHOICES, required=False, label='Type'

View File

@ -2,15 +2,7 @@
{% load render_table from django_tables2 %} {% load render_table from django_tables2 %}
{% block content %} {% block content %}
<div class="row home-search" style="padding: 15px 0px 20px"> {% include 'search_form.html' %}
<div class="col-md-12 text-right">
<form action="{% url 'search' %}" method="get" class="form form-inline">
{{ search_form.q }}
{{ search_form.obj_type }}
<button type="submit" class="btn btn-primary">Search</button>
</form>
</div>
</div>
<div class="row"> <div class="row">
<div class="col-sm-6 col-md-4"> <div class="col-sm-6 col-md-4">
<div class="panel panel-default"> <div class="panel panel-default">

View File

@ -3,52 +3,43 @@
{% block content %} {% block content %}
{% if request.GET.q %} {% if request.GET.q %}
<div class="row"> {% include 'search_form.html' with search_form=form %}
<div class="col-md-4 col-md-offset-4"> {% if results %}
{# Compressed search form #} <div class="row">
<form action="{% url 'search' %}" method="get" class="form form-inline pull-right"> <div class="col-md-10">
{{ form.q }} {% for obj_type in results %}
{{ form.obj_type }} <h3 id="{{ obj_type.name }}">{{ obj_type.name|title }}</h3>
<button type="submit" class="btn btn-primary"> {% include 'table.html' with table=obj_type.table %}
<span class="fa fa-search" aria-hidden="true"></span> Search {% if obj_type.total > obj_type.table.rows|length %}
</button> <a href="{{ obj_type.url }}" class="btn btn-primary pull-right">
</form> <span class="fa fa-search" aria-hidden="true"></span>
</div> All {{ obj_type.total }} results
</div> </a>
<div class="row"> {% endif %}
<div class="col-md-10"> <div class="clearfix"></div>
{% for obj_type in results %} {% endfor %}
<h3 id="{{ obj_type.name }}">{{ obj_type.name|title }}</h3> </div>
{% include 'table.html' with table=obj_type.table %} <div class="col-md-2" style="padding-top: 20px;">
{% if obj_type.total > obj_type.table.rows|length %} {% if results %}
<a href="{{ obj_type.url }}" class="btn btn-primary pull-right"> <div class="panel panel-default">
<span class="fa fa-search" aria-hidden="true"></span> <div class="panel-heading">
All {{ obj_type.total }} results <strong>Search Results</strong>
</a> </div>
<div class="list-group">
{% for obj_type in results %}
<a href="#{{ obj_type.name }}" class="list-group-item">
{{ obj_type.name|title }}
<span class="badge">{{ obj_type.total }}</span>
</a>
{% endfor %}
</div>
</div>
{% endif %} {% endif %}
<div class="clearfix"></div> </div>
{% empty %}
<h3 class="text-muted">No results found</h3>
{% endfor %}
</div> </div>
<div class="col-md-2" style="padding-top: 20px;"> {% else %}
{% if results %} <h3 class="text-muted text-center">No results found</h3>
<div class="panel panel-default"> {% endif %}
<div class="panel-heading">
<strong>Search Results</strong>
</div>
<div class="list-group">
{% for obj_type in results %}
<a href="#{{ obj_type.name }}" class="list-group-item">
{{ obj_type.name|title }}
<span class="badge">{{ obj_type.total }}</span>
</a>
{% endfor %}
</div>
</div>
{% endif %}
</div>
</div>
{% else %} {% else %}
{# Larger search form #} {# Larger search form #}
<div class="row" style="margin-top: 150px;"> <div class="row" style="margin-top: 150px;">

View File

@ -0,0 +1,9 @@
<div class="row" style="padding-bottom: 20px">
<div class="col-md-12 text-center">
<form action="{% url 'search' %}" method="get" class="form-inline">
{{ search_form.q }}
{{ search_form.obj_type }}
<button type="submit" class="btn btn-primary">Search</button>
</form>
</div>
</div>