{% load static %}

<!-- this element should be uesd by lists, to filter elements -->

<form id="filterForm" action="{{form.action_url}}" method="{{form.method}}">
    {% for field in form %}
       {% if field.is_hidden %}
       <div style="display:none">
       {% else %}
       <div class="form-group row m-0 p-0">
       {% endif %}
          <label for="{{field.id_for_label}}" class="col-sm-2 col-form-label my-0 py-0">{{field.label}}</label>
          <div class="col-sm-10 my-0 py-0">
             <div>
             {{field }}
             </div>
	     {% if field.help_text %}
             <small id="{{field.id_for_label}}_help" class="form-text text-muted">
               {{field.help_text | safe }}
             </small>
	     {% endif %}
          </div>
       </div>
    {% endfor %}

    <div class="mt-2">
    {% if form_submit_button_name %}
       <button id="btnFilterForm" type="submit" value="{{form_submit_button_name}}" class="btn btn-primary btnFilterTrigger" role="button">{{form_submit_button_name}}</button>
    {% else %}
       <button id="btnFilterForm" type="submit" value="Submit" class="btn btn-primary btnFilterTrigger" role="button">Submit</button>
    {% endif %}

    <a id="btnSearchHistory" class="btn btn-primary" href="#searchHistory" title="Search history">
       History
    </a>

    <a id="btnSearchSyntax" class="btn btn-primary" href="#searchSyntax" title="Search syntax">
      ?
    </a>

    <div id="searchSuggestions">
    </div> 
</form>


<div id="searchHistory">
</div> 

<div id="searchSyntax">
   {% include "rsshistory/form_search_syntax_element.html" %} 

  {% if query %}
    <pre>
    {{query}}
    </pre>
  {% endif %}
</div> 

{% if form.errors.items %}
<ul>
  {% for field, errors in form.errors.items %}
    {% for error in errors %}
      <li>{{ field|title }}: {{ error }}</li>
    {% endfor %}
  {% endfor %}
</ul>
{% endif %}

{% if form_errors %}
  <div style="color:red">
    {% for error in form_errors %}
     <div>{{error}}</div>
    {% endfor %}
  </div>
{% endif %}

{% if form_warnings %}
  <div style="color:red">
    {% for warning in form_warnings %}
     <div>{{warning}}</div>
    {% endfor %}
  </div>
{% endif %}

{% if form_notes %}
  <div>
    {% for note in form_notes %}
     <div>{{note}}</div>
    {% endfor %}
  </div>
{% endif %}

{% if query_filter.is_error %}
<div class="error-text">There errors with your query</div>
{% endif %}