Javascript 选择/下拉/自动完成的输入，但也允许用户输入值laravel

我正在用Laravel制作一个Web应用程序，其中一部分是用户指定他们居住的地方。当他们在country select中选择一个国家时，它使用AJAX将该国家的州填充到州输入（“下拉菜单”）。当他们选择一个州时，会使用AJAX将该州的城市填充到城市输入（“下拉菜单”）。世界上有如此多的州和城市，因此将根据用户的输入填充州和城市mySQL表

如何使用Laravel和jQuery进行选择/下拉/自动完成输入，以允许1）用户根据先前选择的值从数据库中存储的值列表中选择选项，2）如果不存在新值，则添加新值

以下是我试图将国家和州投入链接在一起的尝试：

//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
});

---

您不能使用一个带有基于ajax响应的选项的数据列表，接受新值，以便下次使用这些新值填充数组吗

---

我正在研究数据列表。