{% load static %}

    <link rel="stylesheet" href="{% static 'css/ion.rangeSlider.min.css' %}">


<form class = "new_route" name="new_route" method="post">
        {% csrf_token %}
 <div>
{#    <div class="type_transport_list">#}
{#        <label for="id_type_transport">{{ form.fields.type_transport.label }}</label>#}
{#        <label for="id_type_transport"></label>#}
{##}
{#     {% for item in form.fields.type_transport.choices  %}#}
{#         <label>#}
{#             <input type="radio"#}
{#                    onclick="OnSelectionChange(this)"#}
{#                    name="type_transport"#}
{#                    id="id_type_transport_{{ forloop.counter }}"#}
{#                    value="{{ item.0 }}"#}
{##}
{#                        {% if form.initial.type_transport == item.0 %}#}
{#                            checked="checked"#}
{#                        {% endif %}#}
{#             />#}
{#             {{ item.1 }}#}
{#        </label>#}
{#     {% endfor %}#}
{##}
{#    </div>#}



    <select
            onchange="OnSelectionChange(this)"
            name="type_transport"
            id="id_type_transport"
            class="el_form_b_new_route">

                        {% for item in form.fields.type_transport.choices  %}
                             <option
                                     value="{{ item.0 }}"

                                     {% if form.initial.type_transport == item.0 %}
                                             selected="selected"
                                     {% endif %}>
                                 {{ item.1 }}
                             </option>
                        {% endfor %}

    </select>
    {% if not errors_off and form.errors and form.errors.type_transport %}
        <span>{{ form.errors.type_transport }}</span>
    {% endif %}
  </div>

{% if form.initial and form.initial.type_transport and form.initial.type_transport != '' %}
    <hr>
    <div class="departure_arrival">
          <div>
              <label for="id_departure_DT">{{ form.fields.departure_DT.label }}</label>


          <input
                   type="datetime-local"
                   min= {% now "Y-m-d" %}T{% now "H:i" %}
                   name="departure_DT"
                   onchange="checkDate()"
                   {% if form.fields.departure_DT.required %} required{% endif %}
                   id="id_departure_DT"
                   class="el_form_b_new_route"
                    placeholder="Выберите дату и время"
                   {% if form.initial.departure_DT %}value="{{ form.initial.departure_DT.date|date:"Y-m-d" }}T{{ form.initial.departure_DT.time|date:"H:i" }}"{% endif %}
           />

          {% if not errors_off and form.errors and form.errors.departure_DT %}
              <span>{{ form.errors.departure_DT }}</span>
          {% endif %}

        </div>
        <div id="arrival_div">
          <label for="id_arrival_DT">{{ form.fields.arrival_DT.label }}</label>
          <input
                  type="datetime-local"
                  min= {% now "Y-m-d" %}T{% now "H:i" %}
                  name="arrival_DT"
                  onchange="checkDate()"
                  {% if form.fields.arrival_DT.required %} required{% endif %}
                  id="id_arrival_DT"
                  class="el_form_b_new_route"
                  {% if form.initial.arrival_DT %}value="{{ form.initial.arrival_DT.date|date:"Y-m-d" }}T{{ form.initial.arrival_DT.time|date:"H:i" }}"{% endif %}
          />
        {% if not errors_off and form.errors and form.errors.arrival_DT %}
            <span>{{ form.errors.arrival_DT }}</span>
        {% endif %}
        </div>
    <div class="clear_both"></div>
    </div>
<hr>
  <div class="from_to_country">
    <div class="from_country_container">
        <label for="id_from_address_point_txt">{{ form.fields.from_address_point.label }}</label>
        <input
                type="number"
                name="from_address_point"
                id="id_from_address_point"
                class="el_form_b_new_route"
                hidden
                {% if form.initial.from_address_point %}value="{{ form.initial.from_address_point }}"{% endif %}
        />
        <input
                oninput="searchTown(this)"
                onclick="showSearchList(this)"
                onblur="onblurInputField(event, this)"
                onFocus="this.select()"
                autocomplete="off"
                type="text"
                minlength="3"

                name="from_address_point_txt"
                class="from_address_point_txt post_route el_form_b_new_route"
                {% if form.fields.from_address_point.required %} required{% endif %}
                id="id_from_address_point_txt"
                {% if form.initial.from_address_point_txt %}value="{{ form.initial.from_address_point_txt }}"{% endif %}
        />
        <datalist id="from_address_point">

        </datalist>

        <div class="input_list post_route" name="from_address_point_txt_list">

        </div>
        {% if not errors_off and form.errors and form.errors.from_address_point %}
            <span>{{ form.errors.from_address_point}}</span>
        {% endif %}
    </div>
  <div>
    <label for="id_to_address_point_txt">{{ form.fields.to_address_point.label }}</label>
    <input
            type="number"
            name="to_address_point"
            id="id_to_address_point"
            class="el_form_b_new_route"
            hidden
            {% if form.initial.to_address_point %}value="{{ form.initial.to_address_point}}"{% endif %}
    />
    <input
            oninput="searchTown(this)"
            onclick="showSearchList(this)"
            onblur="onblurInputField(event, this)"

            onFocus="this.select()"
            autocomplete="off"
            type="text"
            name="to_address_point_txt"
            {% if form.fields.to_address_point.required %} required{% endif %}
            id="id_to_address_point_txt"
            class="to_address_point_txt post_route el_form_b_new_route"
            {% if form.initial.to_address_point_txt %}value="{{ form.initial.to_address_point_txt}}"{% endif %}

    />
    <div class="input_list post_route" name="to_address_point_txt_list">

    </div>
    {% if not errors_off and form.errors and form.errors.to_address_point %}
        <span>{{ form.errors.to_address_point }}</span>
    {% endif %}
  </div>
  </div>
{#  <div>#}
{#    <label for="id_from_city">{{ form.fields.from_city.label }}</label>#}
{#    <input type="text" name="from_city"{% if form.fields.from_city.required %} required{% endif %} id="id_from_city">#}
{#  </div>#}
{#  <div>#}
{#    <label for="id_to_city">{{ form.fields.to_city.label }}</label>#}
{#    <input type="text" name="to_city"{% if form.fields.to_city.required %} required{% endif %} id="id_to_city">#}
{#  </div>#}
  <div class="from_to_place">
    <div>
    <label for="id_from_place">{{ form.fields.from_place.label }}</label>
    <select
            class="el_form_b_new_route"
            name="from_place"
{#            onchange="hideErrorMsg(this)"#}
            id="id_from_place"
            {% if form.fields.from_place.required %} required{% endif %}>
            {% for item in form.fields.from_place.choices  %}
                <option
                        value="{{ item.0 }}"{% if form.initial.from_place == item.0 %}
                        selected="selected"{% endif %}>{{ item.1 }}
                </option>
            {% endfor %}
    </select>
    {% if not errors_off and form.errors and form.errors.from_place %}
                 <span>{{ form.errors.from_place }}</span>
             {% endif %}
    </div>
    <div>
    <label for="id_to_place">{{ form.fields.to_place.label }}</label>
    <select
            name="to_place"
            id="id_to_place"
            class="el_form_b_new_route"
            {% if form.fields.to_place.required %} required{% endif %}>
            {% for item in form.fields.to_place.choices  %}
                <option
                        value="{{ item.0 }}"{% if form.initial.to_place == item.0 %}
                        selected="selected"{% endif %}>{{ item.1 }}
                </option>
            {% endfor %}
    </select>
    {% if not errors_off and form.errors and form.errors.to_place %}
                 <span>{{ form.errors.to_place }}</span>
             {% endif %}
    </div>
  </div>

<hr>

  <div>
    <label>{{ form.fields.cargo_type.label }}</label>


  </div>


<div class="checkbox_cargo_type">

            {% for item in form.fields.cargo_type.choices  %}
                <div>
                    <input
                        onclick="validate(this)"
                        class="custom-checkbox cargo_check"
                        type="checkbox"
                        name="cargo_type"
                        id="id_cargo_type_{{ forloop.counter }}"
                        {% if form.fields.cargo_type.required %} required{% endif %}
                            value="{{ item.0 }}"
                        {% if form.initial.cargo_type == item.0 %}
                            checked="checked"
                        {% endif %}
                    />

                    <label

                            for="id_cargo_type_{{ forloop.counter }}" >
                        <span>{{ item.1 }}</span>
                    </label>
                </div>
            {% endfor %}


{% if not errors_off and form.errors and form.errors.cargo_type %}
                     <span>{{ form.errors.cargo_type }}</span>
                 {% endif %}

</div>


<hr>

  <div class="extra-controls">
      <label for="id_weight">{{ form.fields.weight.label }}</label>
      <input
              type="number"
              maxlength="4"
              class="js-input"
              placeholder="Укажите вес"
              class="el_form_b_new_route"
              {% if form.fields.weight.required %} required{% endif %}

      />
  {% if not errors_off and form.errors and form.errors.weight %}
                     <span>{{ form.errors.weight }}</span>
                 {% endif %}
  </div>

  <div class="range-slider">

      <input
              type="text"
              id="id_weight" id="id_weight"
              class="el_form_b_new_route"
              name="weight"
              {% if form.initial.weight %}
                value="{{ form.initial.weight }}"
              {% endif %}
      />
  {% if not errors_off and form.errors and form.errors.weight %}
      <span>{{ form.errors.weight }}</span>
  {% endif %}
  </div>



<hr>

<div class="phone">
  <div>
    <label for="id_phone">{{ form.fields.phone.label }}</label>
    <input
            type="phone"
            name="phone"
            autocomplete="off"
            maxlength="13"
            minlength="11"
            class="el_form_b_new_route"
            placeholder="{{ form.fields.phone.label }}"
            {% if form.fields.phone.required %} required{% endif %}
            id="id_phone"
            {% if form.initial.phone %}value="{{ form.initial.phone}}"{% endif %}

    />
      {% if not errors_off and form.errors and form.errors.phone %}
          <span>{{ form.errors.phone }}</span>
      {% endif %}
  </div>

  <div>

    <label for="id_extra_phone">{{ form.fields.extra_phone.label }}</label>
    <input
            type="phone"
            name="extra_phone"
            id="id_extra_phone"
            class="el_form_b_new_route"
            autocomplete="off"
            maxlength="13"
            minlength="11"
            placeholder="{{ form.fields.extra_phone.label }}"
            {% if form.initial.extra_phone %}value="{{ form.initial.extra_phone}}"{% endif %}
    />
  {% if not errors_off and form.errors and form.errors.extra_phone %}
      <span>{{ form.errors.extra_phone }}</span>
  {% endif %}

  </div>
<div class="clear_both"></div>
</div>

<hr>

  <div>

    <input type="checkbox" name="receive_msg_by_email" class="custom-checkbox" id="id_receive_msg_by_email">
    <label for="id_receive_msg_by_email">
        <div class="receive_msg_by_email">{{ form.fields.receive_msg_by_email.label }}</div>

        <img id="img_msg_by_email"
           src="/static/img/svg/info2.svg"
           alt="">
        <div class="title_for_msg_by_email">Выберите, чтобы получать уведомление на E-mail, как только появится посылка по заданным критериям</div>

    </label>

  

       {% if not errors_off and form.errors and form.errors.receive_msg_by_email %}
                    {{ form.errors.receive_msg_by_email }}
                 {% endif %}
  </div>
  <div class="button_register">
     <button id="registration" onclick="sendRoute(this, {% if route.id%}{{ route.id }}{% endif %})"> Разместить объявления  </button>
  </div>


{% endif %}

</form>