{% load static %}

<!-- this element should be uesd by lists, to filter elements, where one line of input is enough -->

<form id="filterForm" action="{{form.action_url}}" method="{{form.method}}">
   {% csrf_token %}

   {% for field in form %}
	    {% if field.help_text %}
          <div>
            <small id="{{field.id_for_label}}_help" class="form-text text-muted">
              {{field.help_text | safe }}
            </small>
          </div>
	    {% endif %}

        <label for="{{field.id_for_label}}" class="col-form-label">{{field.label}}</label>

        <span>
        {{field }}
        <datalist id="formDataList">
        </datalist>
        </span>

   {% endfor %}

    {% 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 %}