CODEWITHSUNDEEP
phpjqueryjson
user1661548
user1661548

Reputation:

jQuery Autocomplete Input Box

So I created an auto complete box using jQuery and PHP to pull the content from the database, and it's working fine, except when I go to type in the input box it pulls back all the results, instead of the results similar to what I'm typing.

So if you type Test it pulls back:

This
is
a
Test

Instead of displaying

Test

Here is my HTML

<input type="text" id="group_name" name="group_name">

Here is the jQuery I'm using

<script>
     $(document).ready(function() {
        $( "#group_name" ).autocomplete({
              source: "/wuzhapnn/php/data_stream/group_names",
              select: function(event, ui) { 
              $("#f").submit(); }
        });
    });
</script>

Here is my php page

if ($_GET['run'] == 'group_names') {
    // pulls live data from database
    $db = db_open();
    $query = "SELECT group_name FROM groups";
    $result = db_query($db, $query);
    if (db_num_rows($result) > 1) {
        $result = db_fetch_all($result);
        foreach ($result as $key=>$value) {
            $group_names_array[] .= $value['group_name'];
        }   
    } else {

    }

    echo json_encode(array_values(array_unique($group_names_array)));  
}

New jQuery

<script>
    var availableName;

    $.getJson('/wuzhapnn/php/data_stream',function(response){
        availableName = response;
    });

     $(document).ready(function() {
        $( "#group_name" ).autocomplete({
            source: availableName,
              select: function(event, ui) { 
              $("#f").submit(); }
        });
    });
</script>

New PHP Page

if ($_GET['run'] == 'group_names') {
    // pulls live data from database
    $db = db_open();
    $query = "SELECT group_name FROM groups WHERE group_name LIKE '%".$_GET['term']."%'";
    $result = db_query($db, $query);
    if (db_num_rows($result) > 1) {
        $result = db_fetch_all($result);
        foreach ($result as $key=>$value) {
            $group_names_array[] .= $value['group_name'];
        }   
    } else {

    }

    echo json_encode(array_values(array_unique($group_names_array)));  
}

Upvotes: 3

Views: 636

Answers (3)

user1661548
user1661548

Reputation:

Got it working right

New jQuery

<script>
    $(function() {       
        $( "#group_name" ).autocomplete({
          source: "/wuzhapnn/php/data_stream",
          minLength: 2,
        });
      });
</script>

New PHP (thanks to Dipesh Parmar)

// pulls live data from database
$db = db_open();
$query = "SELECT group_name FROM groups WHERE group_name LIKE '%".$_GET['term']."%'";
$result = db_query($db, $query);

    $result = db_fetch_all($result);
    foreach ($result as $key=>$value) {
        $group_names_array[] .= $value['group_name'];
    }   


echo json_encode(array_values(array_unique($group_names_array)));

Upvotes: 0

Dipesh Parmar
Dipesh Parmar

Reputation: 27364

You need to add LIKE clause.

"SELECT group_name FROM groups WHERE group_name LIKE '%".$_GET['term']."%'";

because "SELECT group_name FROM groups" this will give all the result from database but you need only those who match with typed words so use LIKE MySQL clause.

Other Person Comment Response.

if you want to create json object before use it you can do it as below,

var availableName;

$.getJson('/wuzhapnn/php/data_stream/group_names',function(response){
   availableName = response;
});

after this just use below code for autoComplete.

$( "#group_name" ).autocomplete({
     source: availableName ,

Upvotes: 2

samjm
samjm

Reputation: 51

Your PHP snippet doesn't actually use the value sent by the autocomplete plugin. If you are using JQuery's plugin then the value send is a GET parameter called terms.

This needs to be included in your PHP.

$term = $_GET['term'];

You then need to include that in your query something like the following, but first please escape this value before using it directly in an SQL statement.

SELECT group_name FROM groups WHERE group_name LIKE %<term>%

Upvotes: 1

Related Questions