diff --git a/observations/templates/observations/index.html b/observations/templates/observations/index.html index 70071e5a6bbf96d4e438edef6bb76f4c4b8fe30e..0df65c116dbcaf7cde53114af4869f5ff08b5c16 100644 --- a/observations/templates/observations/index.html +++ b/observations/templates/observations/index.html @@ -34,36 +34,51 @@ </div> <div id="legend"></div> </div> -<form class="form-inline" method="get" action=""> - <div class="form-group"> - <input class="form-control" type="date" id="dateFrom" name="from" value="{{from|safe}}"/> - </div> - - - <div class="form-group"> - <input class="form-control" type="date" id="dateTo" name="to" value="{{to|safe}}"/> - </div> - <div class="form-group"> - <select name="pestId" id="observationPestList" class="form-control chosen-select" data-placeholder="{% trans "Organism" %}"> - </select> - </div> - <div class="form-group"> - <select name="cropId" id="observationCropList" class="form-control chosen-select" data-placeholder="{% trans "Crop" %}"> - </select> - </div> - <div class="form-group"> - <select name="cropCategoryId" id="cropCategoryList" style="min-width: 150px;" class="form-control chosen-select" data-placeholder="{% trans "Crop categories" %}"> - </select> - </div> +<form method="get" action="" class=""> + <div class="row"> + <!-- Date Range Fields --> + <div class="form-group col-sm-3"> + <label for="dateFrom">{% trans "From" %}</label> + <input class="form-control" type="date" id="dateFrom" name="from" value="{{from|safe}}"/> + </div> + <div class="form-group col-sm-3"> + <label for="dateTo">{% trans "To" %}</label> + <input class="form-control" type="date" id="dateTo" name="to" value="{{to|safe}}"/> + </div> + <div class="form-group col-sm-6"> <div class="checkbox"> <label> - <input type="checkbox" name="includeNegative"{% if include_negative %}checked{% endif %} value="true"> {% trans "Include registrations without pest presence" %} + <input type="checkbox" name="includeNegative"{% if include_negative %}checked{% endif %} value="true"> {% trans "Include registrations without pest presence" %} </label> - </div> + </div> + </div> + </div> + + <div class="row mt-2"> + <div class="form-group col-sm-3"> + <label for="observationPestList">{% trans "Organism" %}</label> + <select name="pestId" id="observationPestList" class="form-control chosen-select" data-placeholder="{% trans "Organism" %}"> + </select> + </div> + <div class="form-group col-sm-3"> + <label for="observationCropList">{% trans "Crop" %}</label> + <select name="cropId" id="observationCropList" class="form-control chosen-select" data-placeholder="{% trans "Crop" %}"> + </select> + </div> + <div class="form-group col-sm-3"> + <label for="cropCategoryList">{% trans "Crop categories" %}</label> + <select name="cropCategoryId" id="cropCategoryList" class="form-control chosen-select" style="min-width: 150px;" data-placeholder="{% trans "Crop categories" %}"> + </select> + </div> + <div class="form-group col-sm-3"> <button type="submit" class="btn btn-primary">{% trans "Filter" %}</button> - </form> + <a id="downloadLink" href="">{% trans "Download as Excel" %}</a> + </div> + </div> +</form> + <div style="padding: 10px 0px"> <span id="emptyResult">{% trans "No observations found for specified search criteria" %}</span> - <a id="downloadLink" href="">{% trans "Download as Excel" %}</a> </div> <div class="table-responsive"> <table class="table table-striped" id="observationTable">