0.0.26 upd autocomlitev2.js

static/css/styles.css

@@ -997,4 +997,15 @@ form.new_route{
     border-bottom-color: #26C9FF;
     outline: solid 1px #26C9FF;
   }
-/*autocomplete-wrapper END*/
+/*autocomplete-wrapper END*/
+
+.input_list{
+    display: none;
+}
+
+.input_list.show{
+    display:block;
+    height: 300px;
+    width: 50%;
+    overflow: scroll;
+}

static/js/autocomlitev2.js

@@ -16,7 +16,7 @@ function searchTown(el){
         // enctype: 'json',
         data: JSON.stringify(get_address_point),
         success: function(data){
-            return data;
+            return search(data)
         },
         error: function (data){
             console.log('++')
@@ -27,27 +27,30 @@ function searchTown(el){
 
 
 
-function search(e) {
+function search(data) {
 
-  let ac = document.querySelector("#id_from_country")
+  let ac = document.querySelector("#id_from_address_point")
 
   if (ac.value.length > 0) {
 
-     let results = searchTown(ac);
+     let res_data = data.data
 
-    var divs = results.map(function(r, i) {
+    var divs = res_data.map(function(r, i) {
         return '<div class="autocomplete-result" data-index="'+ i +'">'
-             + '<div><b>'+ r.iata +'</b> - '+ r.name +'</div>'
+             + '<div><b>'+ r.iata_code +'</b> - '+ r.name +'</div>'
-             + '<div class="autocomplete-location">'+ r.city +', '+ r.country +'</div>'
+             + '<div class="autocomplete-location">'+ r.city__name +', '+ r.city__country__name +'</div>'
              + '</div>';
      });
+     divs.attr('data-highlight', selectedIndex);
+     document.querySelector(".input_list").innerHTML = divs
 
     selectedIndex = -1;
-    list.html(divs.join(''))
+    // .html(divs.join(''))
-      .attr('data-highlight', selectedIndex);
+    //   .attr('data-highlight', selectedIndex);
 
   } else {
     numResults = 0;
-    list.empty();
+    divs.empty();
+
   }
 }

templates/blocks/profile/b_new_route.html

@@ -39,17 +39,18 @@
 <hr>
   <div class="from_to_country">
     <div>
-    <label for="id_from_country">{{ form.fields.from_country.label }}</label>
+    <label for="id_from_address_point">{{ form.fields.from_address_point.label }}</label>
-    <input oninput="search(this)" type="text" name="from_country"{% if form.fields.from_country.required %} required{% endif %} id="id_from_country">
+    <input oninput="searchTown(this)" type="text" name="from_address_point"{% if form.fields.from_address_point.required %} required{% endif %} id="id_from_address_point">
-    {% if form.errors and form.errors.from_country %}
+    <div class="input_list"></div>
-                 <span>{{ form.errors.from_country }}</span>
+    {% if form.errors and form.errors.from_address_point %}
+                 <span>{{ form.errors.from_address_point}}</span>
              {% endif %}
     </div>
   <div>
-    <label for="id_to_country">{{ form.fields.to_country.label }}</label>
+    <label for="id_to_address_point">{{ form.fields.to_address_point.label }}</label>
-    <input type="text" name="to_country"{% if form.fields.to_country.required %} required{% endif %} id="id_to_country">
+    <input type="text" name="to_address_point"{% if form.fields.to_address_point.required %} required{% endif %} id="id_to_address_point">
-    {% if form.errors and form.errors.to_country %}
+    {% if form.errors and form.errors.to_address_point %}
-                 <span>{{ form.errors.to_country }}</span>
+                 <span>{{ form.errors.to_address_point }}</span>
              {% endif %}
   </div>
   </div>