Dropdown value based Autocomplete

Question

0.00/5 (No votes)

See more:

XML

I am trying to do autocomplete function based on dropdown selection value.

My index.php page:

     <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>

My autocomplete.php page:

 <?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";
 }
 }
 ?>

Based on the city selection dropdown value,in search textbox localty should be displayed on entering first letter.But I'm not getting values in autocomplete.php page.

Please give any suggestions.

Posted 1-Feb-15 19:58pm

Member 11310933

Add a Solution

Comments

Pranay Rana 2-Feb-15 2:20am

please check updated answer go through the link of the answer

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Pranay Rana · Answer 1 · 2015-02-01T20:13:00

the way you are passing data is wrong that may be one reason of not working. as you want to pass data as get request you should append the data in the query string like this

JavaScript

url: 'autocomplete.php?src='+res + '&value=' + $("#search").val(),

or if you want to pass data as json than do proper formatting of passed data as below , i.e. pass data in json formate as show below

C#

data: {
                           src: res,
                           value: $('#search').val();
                        }

Also refer this example : http://www.smarttutorials.net/jquery-autocomplete-search-using-php-mysql-and-ajax/[^]

i hope by doing this your code will work