Forked from - Forked from - New snippet 945

xxxxxxxxxx
 
<div class="container">
  
<div class="md-form">
  <input type="search" id="form-autocomplete" class="form-control mdb-autocomplete">
  <button class="mdb-autocomplete-clear">
    <svg fill="#000000" height="24" viewBox="0 0 24 24" width="24" xmlns="https://www.w3.org/2000/svg">
      <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" />
      <path d="M0 0h24v24H0z" fill="none" />
    </svg>
  </button>
  <label for="form-autocomplete" class="active">What is your favorite US state?</label>
</div>
<div>
Results:
  <div id="results">
  </div>
  </div>
</div>
​

​

xxxxxxxxxx
 
var states = [
"Alabama",
"Alaska",
"Arizona",
"Arkansas",
"California",
"Colorado",
"Connecticut",
"Delaware",
"Florida",
"Georgia",
"Hawaii",
"Idaho",
"Illnois",
"Indiana",
"Iowa",
"Kansas",
"Kentucky",
"Louisiana",
"Maine",
"Maryland",
"Massachusetts",
"Michigan",
"Minnesota",
"Mississippi",
"Missouri",
"Montana",
"Nebraska",
"Nevada",
"New Hampshire",
"New Jersey",
"New Mexico",
"New York",
"North Carolina",
"North Dakota",
"Ohio",
"Oklahoma",
"Oregon",
"Pennsylvania",
"Rhode Island",
"South Carolina",
"South Dakota",
"Tennessee",
"Texas",
"Utah",
"Vermont",
"Virginia",
"Washington", 
"West Virginia",
"Wisconsin",
"Wyoming"
];
​
$('#form-autocomplete').mdbAutocomplete({
data: states
});
​
const addResult = () => {
   $("#results").text($("#form-autocomplete").val())  
};
​
$(function () {
    // Type Tex, click texas or keydown and enter on texas
    
  
    $("#form-autocomplete").on('change', addResult)
  
    $(".mdb-autocomplete-wrap").on("click", function() {
      setTimeout(addResult());
    });
  
})

Console errors: 0