1$(function () { 2 function autocomplete(inp, arr) { 3 $("input[id$='txtStreet']").parent("div").addClass("autocomplete"); 4 /*the autocomplete function takes two arguments, 5 the text field element and an array of possible autocompleted values:*/ 6 var currentFocus; 7 /*execute a function when someone writes in the text field:*/ 8 // inp.addEventListener("input", function(e) { 9 var a, 10 b, 11 i, 12 val = inp.value; 13 /*close any already open lists of autocompleted values*/ 14 closeAllLists(); 15 if (!val) { 16 return false; 17 } 18 currentFocus = -1; 19 /*create a DIV element that will contain the items (values):*/ 20 a = document.createElement("DIV"); 21 a.setAttribute("id", inp.id + "autocomplete-list"); 22 a.setAttribute("class", "autocomplete-items"); 23 /*append the DIV element as a child of the autocomplete container:*/ 24 inp.parentNode.appendChild(a); 25 /*for each item in the array...*/ 26 for (i = 0; i < arr.length; i++) { 27 /*check if the item starts with the same letters as the text field value:*/ 28 if ( 29 arr[i].text.substr(0, val.length).toUpperCase() == val.toUpperCase() 30 ) { 31 /*create a DIV element for each matching element:*/ 32 b = document.createElement("DIV"); 33 /*make the matching letters bold:*/ 34 b.innerHTML = 35 "<strong>" + arr[i].text.substr(0, val.length) + "</strong>"; 36 b.innerHTML += arr[i].text.substr(val.length); 37 /*insert a input field that will hold the current array item's value:*/ 38 b.innerHTML += 39 '<input id="street" type="hidden" value="' + 40 arr[i].street_line + 41 '">'; 42 b.innerHTML += 43 '<input id="city" type="hidden" value="' + arr[i].city + '">'; 44 b.innerHTML += 45 '<input id="state" type="hidden" value="' + arr[i].state + '">'; 46 47 /*execute a function when someone clicks on the item value (DIV element):*/ 48 b.addEventListener("click", function (e) { 49 // Ajax Call to Get Zip Code 50 $.ajax({
51 url: "/controls/handlers/zipcodeaddress.ashx?z=1", 52 data: { 53 street: this.getElementsByTagName("input")[0].value, 54 state: this.getElementsByTagName("input")[2].value, 55 city: this.getElementsByTagName("input")[1].value, 56 }, 57 dataType: "json", 58 type: "GET", 59 success: function (result, success) { 60 var zip = $("input[id$='txtZIP']")[0]; 61 zip.value = result; 62 }, 63 }); 64 /*insert the value for the autocomplete text field:*/ 65 var city = $("input[id$='txtCity']")[0]; 66 var state = $("select[id$='txtState']")[0]; 67 inp.value = this.getElementsByTagName("input")[0].value; 68 city.value = this.getElementsByTagName("input")[1].value; 69 state.value = this.getElementsByTagName("input")[2].value; 70 71 /*close the list of autocompleted values, 72 (or any other open lists of autocompleted values:*/ 73 closeAllLists(); 74 }); 75 a.appendChild(b); 76 } 77 } 78 // }); 79 /*execute a function presses a key on the keyboard:*/ 80 inp.addEventListener("keydown", function (e) { 81 var x = document.getElementById(this.id + "autocomplete-list"); 82 if (x) x = x.getElementsByTagName("div"); 83 if (e.keyCode == 40) { 84 /*If the arrow DOWN key is pressed, 85 increase the currentFocus variable:*/ 86 currentFocus++; 87 /*and and make the current item more visible:*/ 88 addActive(x); 89 } else if (e.keyCode == 38) { 90 //up 91 /*If the arrow UP key is pressed, 92 decrease the currentFocus variable:*/ 93 currentFocus--; 94 /*and and make the current item more visible:*/ 95 addActive(x); 96 } else if (e.keyCode == 13) { 97 /*If the ENTER key is pressed, prevent the form from being submitted,*/ 98 e.preventDefault(); 99 if (currentFocus > -1) { 100 /*and simulate a click on the "active" item:*/ 101 if (x) x[currentFocus].click(); 102 } 103 } 104 }); 105 function addActive(x) { 106 /*a function to classify an item as "active":*/ 107 if (!x) return false; 108 /*start by removing the "active" class on all items:*/ 109 removeActive(x); 110 if (currentFocus >= x.length) currentFocus = 0; 111 if (currentFocus < 0) currentFocus = x.length - 1; 112 /*add class "autocomplete-active":*/ 113 x[currentFocus].classList.add("autocomplete-active"); 114 } 115 function removeActive(x) { 116 /*a function to remove the "active" class from all autocomplete items:*/ 117 for (var i = 0; i < x.length; i++) { 118 x[i].classList.remove("autocomplete-active"); 119 } 120 } 121 function closeAllLists(elmnt) { 122 /*close all autocomplete lists in the document, 123 except the one passed as an argument:*/ 124 var x = document.getElementsByClassName("autocomplete-items"); 125 for (var i = 0; i < x.length; i++) { 126 if (elmnt != x[i] && elmnt != inp) { 127 x[i].parentNode.removeChild(x[i]); 128 } 129 } 130 } 131 /*execute a function when someone clicks in the document:*/ 132 document.addEventListener("click", function (e) { 133 closeAllLists(e.target); 134 }); 135 } 136 137 $("input[id$='txtStreet']").keyup(function (event) { 138 if ( 139 event.keyCode !== 40 && 140 event.keyCode !== 38 && 141 (event.keyCode !== 13) & (event.keyCode !== 27) 142 ) { 143 var el = $(this); 144 145 // Ajax Call to Get Address and State 146 $.ajax({
147 url: "/controls/handlers/addressautocomplete.ashx", 148 data: { 149 // key: key, 150 s: el.val(), 151 }, 152 dataType: "json", 153 type: "GET", 154 success: function (result, success) { 155 autocomplete($("input[id$='txtStreet']")[0], result.suggestions); 156 }, 157 }); 158 } 159 }); 160});
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.