如何根据PHP MySQL和JQuery中输入的州名自动完成城市列表

Question

I am able to auto fill(complete) states and cities textboxes independently using below mentioned script.

But I want to do following.

• First I enter state name in state textbox and select any state from suggested states list.

• There after I enter city name in city textbox but at that time suggested cities list should be filtered according to selected state.

• For Example: First I enter/select 'New York' in state textbox, after that when I enter city name in city textbox then I should get suggest cities list only for 'New York' state.

Please let me know what changes I need to do in script to get desired result.

NOTE: statepkid field is available in tr_cities table for relation.

index.php

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
    $(function() {
        $( "#statename" ).autocomplete({
          source: 'search.php'
        });
    });
    $(function() {
        $( "#cityname" ).autocomplete({
          source: 'c_search.php'
        });
    });
</script>

<div class="ui-widget">
    <label for="statename">State: </label>
    <input id="statename">

    <label for="cityname">City: </label>
    <input id="cityname">
</div>

search.php (for states)

$dbHost = 'localhost';
$dbUsername = 'root';
$dbPassword = 'password';
$dbName = '10000dbname';
$db = new mysqli($dbHost,$dbUsername,$dbPassword,$dbName);
$searchTerm = $_GET['term'];
$query = $db->query("SELECT * FROM tr_states WHERE statename LIKE '%".$searchTerm."%' ORDER BY statename ASC");
while ($row = $query->fetch_assoc()) {
    $data[] = $row['statename'];
}
echo json_encode($data);

c_search.php (for cities)

$dbHost = 'localhost';
$dbUsername = 'root';
$dbPassword = 'password';
$dbName = '10000dbname';
$db = new mysqli($dbHost,$dbUsername,$dbPassword,$dbName);
$searchTerm = $_GET['term'];
$query = $db->query("SELECT * FROM tr_cities WHERE city LIKE '%".$searchTerm."%' ORDER BY city ASC");
while ($row = $query->fetch_assoc()) {
    $data[] = $row['city'];
}
echo json_encode($data);

Answer 1

In your JS

source: 'c_search.php?state=' + $('#statename').val()

and in php file

I am assuming that the column name is state_id in you city table.

if(isset($_GET['state'])){
$stateid = $_GET['state'];
    $query = $db->query("SELECT * FROM tr_cities WHERE city LIKE '%".$searchTerm."%' AND state_id = ".$stateid."  ORDER BY city ASC");
}else{
    $query = $db->query("SELECT * FROM tr_cities WHERE city LIKE '%".$searchTerm."%' ORDER BY city ASC");
}