comparison globalneighbors/templates/index.html @ 13:94af113e498a

we have links
author Jeff Hammel <k0scist@gmail.com>
date Sun, 25 Jun 2017 14:04:49 -0700
parents 6d89ea94930b
children 2fef925fbf37
comparison
equal deleted inserted replaced
12:6d89ea94930b 13:94af113e498a
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <title>Global Neighbors</title> 4 <title>Global Neighbors</title>
5 <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 5 <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
6 <!-- <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> -->
7 <!-- <script> -->
8 <!-- $( function() { -->
9 <!-- $( "#cities" ).autocomplete({ -->
10 <!-- source: "/cities", -->
11 <!-- autoFocus: true, -->
12 <!-- minLength: 3, -->
13 <!-- delay: 1500 -->
14 <!-- }); -->
15 <!-- }); -->
16 <!-- </script> -->
17 <script src="/js/jquery.easy-autocomplete.min.js"></script> 6 <script src="/js/jquery.easy-autocomplete.min.js"></script>
18 <link rel="stylesheet" type="text/css" href="/css/style.css"/> 7 <link rel="stylesheet" type="text/css" href="/css/style.css"/>
19 <link rel="stylesheet" type="text/css" href="/css/easy-autocomplete.css"/> 8 <link rel="stylesheet" type="text/css" href="/css/easy-autocomplete.css"/>
20 <script> 9 <script>
21 $( function() { 10 $( function() {
22 var options = { 11 var options = {
23 url: "/cities", 12 url: function(phrase) {
13 return "/cities?term=" + phrase;
14 },
15 getValue: "name",
24 list: { 16 list: {
25 match: { 17 match: {
26 enabled: true 18 enabled: true
27 } 19 }
28 } 20 },
21 template: {
22 type: "custom",
23 method: function (value, item) {
24 return '<a href="/' + item.geonameid + '">' + value + '</a>';
25 }
26 }
29 }; 27 };
30 $( "#cities" ).easyAutocomplete(options); 28 $( "#cities" ).easyAutocomplete(options);
31 }); 29 });
32 </script> 30 </script>
33 </head> 31 </head>
36 <h2>Serving {{ n_cities }} cities</h2> 34 <h2>Serving {{ n_cities }} cities</h2>
37 35
38 <div class="ui-widget"> 36 <div class="ui-widget">
39 <label for="cities">Enter a city: </label> 37 <label for="cities">Enter a city: </label>
40 <input id="cities"/> 38 <input id="cities"/>
39 <select>
40 <option value="">ALL</option>
41 {% for country_code in country_codes %}
42 <option value="{{ country_code }}">{{ country_code }}</option>
43 {% endfor %}
44 </select>
41 </div> 45 </div>
42 46
43 </body> 47 </body>
44 </html> 48 </html>