Autocomplete does not work

PHP
1

Sir I have these codes

<html>
    <head>
     <link rel="stylesheet" href="css/jquery-ui.css">

    <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>        
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery-ui.js"></script>
    <script type="text/javascript">
    

    $(function() {
    $("#party").autocomplete({
        minLength: 0,
        source: 'autocomplete.php',
        focus: function(event, ui) {
            $("#party").val(ui.item.desc1);
            return false;
        },
            select: function(event, ui) {
                $("party").val(ui.item.desc1);
                $("#code").val(ui.item.code);
                return false;
            }
    });
});

</script>
    </head>
    <body>
    <div id="wrapper">
    <div class="ui-widget">
    <p>Code <input type="text" id="code"></p>
    <p>Party <input type="text" size="40" id="party"></p>
    </div>
    </div>
    </body>
</html>

and autocomplete.php is

<?php
include_once("includes/connectsql.php");

$searchTerm = $_GET['term'];
$query = "SELECT code,desc1 FROM master WHERE desc1 LIKE '".$searchTerm."%'";
$select = sqlsrv_query($con,$query) or die ("Error". sqlsrv_errors($con)) ;  
$i = 0;
while($row=sqlsrv_fetch_array($select)) 
{
      $data[] =$row['code'].' - '. $row['desc1'];
}
//return json data
echo json_encode($data);
?>

When I enter any data in autocomplete complete
then data appears in dropdown list but does not show in relevant textboxes

Please help

1 Like
2

This is both a PHP and JavaScript question.

In any case, I’ll try to answer your query even if it’s been quite a while since the question was posted here. Might be helpful for others with similar issue.

#PHP Fix
The code isn’t shown on the code input is because, the code item doesn’t exist. Nor does desc1. This is because the $data array only contains the value as code - desc1, not individual code and desc1.

Your current data after encoding is:

[
    "1401192 - NASIR JABBAR S/O ABDUL JABBAR 12/BC",
    "1401443 - NASIR MEHMOOD, YAZMAN",
    "2205085 - NASIR IQBAL CASHIER (2006-8000)",
    "2304026 - NASIR MEHMOOD SUTLUGE COLONY BWP.",
    "2307008 - NASIR JAMEEL MAIN ROAD SAKRAND"
]

This should instead be:

[
    {
        "code":"1401192", "desc1": "NASIR JABBAR S/O ABDUL JABBAR 12/BC",
    	"code": "1401443", "desc1": "NASIR MEHMOOD, YAZMAN",
	"code": "2205085", "desc1": "NASIR IQBAL CASHIER (2006-8000)",
	"code": "2304026", "desc1": "NASIR MEHMOOD SUTLUGE COLONY BWP.",
	"code": "2307008", "desc1": "NASIR JAMEEL MAIN ROAD SAKRAND"
    }
]

For this, just create an array containing each row and return the array.

while($row = sqlsrv_fetch_array($select))
{
    $data[] = $row;
}

echo json_encode($data);

##JS Fix
Now, you need to fix the autocomplete to get what you need. Change the autocomplete code to:

$("#party").autocomplete({
        minLength: 0,
        source:"autocomplete.php",
        focus: function(event, ui) {
            $("#party").val(ui.item.desc1);
            return false;
        },
      	select: function(event, ui) {
            $("#party").val(ui.item.desc1);
            $("#code").val(ui.item.code);
            return false;
        }
    })
    .autocomplete( "instance" )._renderItem = function(ul, item) {
        return $("<li>")
            .append("<div>" + item.code + " - " + item.desc1 + "</div>")
            .appendTo(ul);
    };

This should fix your issues.

3

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.