Jquery UI Autocomplete - Select Value

Question

I've got a bit of PHP and JQuery which creates the Autocomplete form:

<?
mysql_select_db($database_database_connection, $database_connection);
$query = "SELECT * FROM Device_tbl";
$result=mysql_query($query, $database_connection) or die(mysql_error());
$findrow = array();
while($row = mysql_fetch_assoc($result)){
    $manufac = $row['Manufacturer'];
    $mod = $row['Model'];
    $string = $manufac.' '.$mod;
    $findrow[] = $string;
}

?>

<script type="text/javascript">
$(document).ready(function() {
  $("#search_input").watermark("Begin Typing to Search");

  var availableTags = <? echo json_encode($findrow);?>;
  $( "#search_input" ).autocomplete({
            source: availableTags
            });


    $("#search_input").bind("autocompleteselect", function() {
        var search_input = $(this).val();
        if (search_input =='') search_input ='*';
        var dataString = 'keyword='+search_input;

        if (search_input.length > 2 || search_input=='*') {
           $.ajax({
                type: "GET",
                url: "core/functions/searchdata.php",
                data: dataString,
                success: function(server_response) {
                    $('#searchresultdata').empty();
                    $('#searchresultdata').append(server_response);
                    $('span#category_title').html(search_input);
                }
            });
        }

        return false;
    });
    $("#search_input").trigger('keyup');
});
</script>

searchdata.php

mysql_select_db($database_database_connection, $database_connection);
$query = "SELECT Image, Manufacturer, Model FROM Device_tbl WHERE Manufacturer LIKE '%$keyword%' OR Model LIKE '%$keyword%'";
if ($keyword=='*') $query = "SELECT Image, Manufacturer, Model FROM Device_tbl";
$result=mysql_query($query, $database_connection) or die(mysql_error());

if($result){
    if(mysql_affected_rows($database_connection)!=0){
          while($row = mysql_fetch_object($result)){
?>
     <div class="hold-cont">
        <div class="holder">
            <div class="image-hold" >
                <img class="image-icon" src="<? echo $deviceimg.($row->Image); ?>"/>
</div>
        </div>
        <div class="device-name devicename-txt"><? echo($row->Manufacturer. ' ' .$row->Model);  ?></div>
    </div>
     <?
    }
    }else {
        echo 'No Results for :"'.$_GET['keyword'].'"';
    }

}
else {
    echo 'Parameter Missing';

The autocomplete part works fine, however what I can't get to work is running the .ajax on the selected value. If, for example I started typing "Apple iMac" and only got as far as "Ap". The suggestion would be Apple iMac, however when I click on the suggestion, it runs the query on "Ap" - ie, its only running the query on what is typed, not what is clicked.

Any ideas how I can make this work when the user either clicks a suggestion OR hits enter?

can you provide the script of searchdata.php

mgraph
– mgraph

2012-05-10 22:14:47 +00:00
Commented May 10, 2012 at 22:14 — mgraph
– mgraph, Commented May 10, 2012 at 22:14

mgraph · Accepted Answer · 2012-05-11 09:05:59Z

1

$( "#search_input" ).autocomplete({
    source: availableTags,
    select: function(event, ui) {
        sendSelected(ui.item.value);
        }
    });

function sendSelected(_val){
    var search_input = _val;
    if (search_input =='') search_input ='*';
    var dataString = 'keyword='+search_input;

    if (search_input.length > 2 || search_input=='*') {
       $.ajax({
            type: "GET",
            url: "core/functions/searchdata.php",
            data: dataString,
            success: function(server_response) {
                $('#searchresultdata').empty();
                $('#searchresultdata').append(server_response);
                $('span#category_title').html(search_input);
            }
        });
    }
}

searchdata.php:

$splitKeyword = explode(" ", $keyword);
if(sizeof($splitKeyword)==3){
    $splitKeyword[1] = $splitKeyword[1]." ".$splitKeyword[2];
 }
$query = "SELECT Image, Manufacturer, Model FROM Device_tbl WHERE Manufacturer LIKE '%".$splitKeyword[0]."%' OR Model LIKE '%".$splitKeyword[1]."%'";

edited May 11, 2012 at 9:05

answered May 10, 2012 at 22:24

mgraph

15.3k4 gold badges43 silver badges76 bronze badges

Sign up to request clarification or add additional context in comments.

11 Comments

K20GH Over a year ago

Worked great! Thanks. However, my SQL clearly doesn't work. Its looking for LIKE Honda Civic in the Manufacturer OR the Model. And since it cant find anything like that, it returns nothing. Even though the database as the Manufacturer Honda and the model for it, Civic :/

mgraph Over a year ago

try this : ... LIKE '%".$keyword."%' OR...

K20GH Over a year ago

Same problem. I believe its because the ui.item.value is a combination of the Manufacturer and Model fields in the database. However, I thought that since I'm doing a LIKE query, it would still find it. 'Honda Civic' is LIKE the Manufacturer 'Honda'...right?

mgraph Over a year ago

@K20GH if you pass Honda Civic LIKE Will only look for char after and before Honda Civic, but you split them

mgraph Over a year ago

@K20GH $splitKeyword[0] will return Honda, $splitKeyword[1] will return Civic

|

Collectives™ on Stack Overflow

Jquery UI Autocomplete - Select Value

1 Answer 1

11 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

11 Comments

Your Answer

Sign up or log in

Post as a guest

Related