title: input that is a select/pulldown/autocomplete but also allows user to enter value laravel
body: <p>I am making a Web application with Laravel, and part of that is users specifying where they live.  When they choose a country in the country select, that uses AJAX to populate the states input ("pulldown menu") with the states for that country.  When they choose a state, that uses AJAX to populate the cities input ("pulldown menu") with the cities for that state.  There are so many states and cities in the world that the states and cities mySQL tables are going to be populated based on user's input.  </p>
  
  <p>How do you make a select/pulldown/autocomplete input with Laravel and jQuery that allows 1) a user to chose an option from a list of values stored in a database based on a previously selected value and 2) add a new value if it's not there?</p>
  
  <p>Below is my attempt to chain the country and state inputs together:</p>
  
  <pre><code>//get id of country selected, AJAX to database and return an array of it's states
  $("#country_id").change(function(){
      var country_id = $(this).val();
      $.ajax({
          url:base_url + "/locations/stateJSON",
          data:{country_id:country_id},
          success: function(states) {
              //console.log(states);
          }
      });
  });
  
  //state's input is text input jQuery autocomplete populated with selected country's states
  $("#state_id").autocomplete({
      source: states,
      minLength: 1
  });
  </code></pre>