드롭 다운 값 기반 자동 완성

Question

드롭 다운 선택 값을 기반으로 자동 완성 기능을 수행하려고합니다.

내의 index.php 페이지 :

 <div>Select City</div> 
    <select id="city"> 
    <option value="select">Select</option> 
    <option value="Chennai">Chennai</option> 
    <option value="Madurai">Madurai</option> 
    <option value="Salem">Salem</option> 
    <option value="Trichy">Trichy</option> 
    </select><br /> 
    <input type="text" id="search" /> 
    <script> 
     $(document).ready(function(){ 
     $('#search').autocomplete({ 
     minLength: 1, 
     source: function(query, process) { 
     var res = $('#city').val(); 
     $.ajax({ 
      url: 'autocomplete.php', 
      type: 'GET', 
      data: "src="+res + "&value=" + $('#search').val(), 
      dataType: 'JSON', 
      async: true, 
      success: function(data) { 
       process(data); 
      } 
     }); 
    } 
}); 
}); 
</script> 

내 autocomplete.php 페이지 :

도시 선택 드롭 다운 값을 바탕으로

<?php 
if (isset($_GET['src'])) { 
$city = $_GET['src']; 
echo $city; 
} 
?> 
<?php 
$loc = $_GET['value']; 
echo $loc; 
$conn=mysql_connect('localhost', 'root', ''); 
if (!$conn) 
{ 
die('Could not connect: ' . mysql_error()); 
} 
if(!mysql_select_db("details")) 
{ 
die('Could not connect database: ' . mysql_error()); 
} 
$sql="SELECT localty FROM localty where localty like '%".$loc."%' and city='$city'"; 
echo $sql; 
$result = mysql_query($sql); 

if($result) 
{ 
while($row=mysql_fetch_array($result)) 
{ 
    echo $row['localty']."\n"; 
} 
} 
?> 

, 검색 텍스트 상자 localty의 첫 글자를 입력에 표시되어야합니다. 하지만 autocomplete.php 페이지에서 값을 얻지 못했습니다.

의견을 보내주십시오.

Answer 1

이 시도 ...

<script> 
    $(document).ready(function(){   
    $('#city').change(function(){     
    $('#search').autocomplete({ 
    minLength: 1, 
    source: function(query, process) { 
    var res = $('#city').val(); 
    $.ajax({ 
     url: 'autocomplete.php', 
     type: 'GET', 
     data: "src="+res + "&value=" + $('#search').val(), 
     dataType: 'JSON', 
     async: true, 
     success: function(data) { 
      process(data); 
     } 
    }); 
    }); 
} 
}); 
}); 
</script>