Hello I want to make a textbox that can select data from a table, when input is givin to the textbox it should autocomplete the sentance with any words it matches within the
I already have this piece of code and it works but it only shows result of the first symbol you type in.
function lookup(inputString)
{
if(inputString.length == 0)
{
$('#suggestions').hide();
}
else
{
$.post("sql_naam_klant.php", {queryString: ""+inputString+""}, function(data)
{
if(data.length >0)
{
$('#suggestions').show();
$('#autoSuggestionsList').html(data);
}
});
}
}
function fill(thisValue)
{
$('.inputString').val(thisValue);
setTimeout("$('.suggestions').hide();", 200);
}
HTML:
<input type="text" name="naam_klant" size="20" id="naam_klant" onkeyup="lookup(this.value);" onblur="fill();" >
<div class="suggestionsBox" id="suggestions" style="display: none;">
<div class="suggestionList" id="autoSuggestionsList">
UPDATE:
<?php
$db = new mysqli('localhost', 'root' ,'*', 'records');
if(!$db)
{
// Show error if we cannot connect.
echo 'ERROR: Could not connect to the database.';
}
else
{
// Is there a posted query string?
if(isset($_POST['queryString']))
{
$queryString = $db->real_escape_string($_POST['queryString']);
// Is the string length greater than 0?
if(strlen($queryString) >0)
{
$query = $db->query("SELECT naam_klant FROM overboekingen WHERE naam_klant LIKE '$queryString%' LIMIT 10");
if($query)
{
while ($result = $query ->fetch_object())
{
echo '<li onClick="fill(\''.$result->naam_klant.'\');">'.$result->naam_klant.'</li>';
}
}
else
{
echo 'ERROR: There was a problem with the query.';
}
}
else
{
} // There is a queryString.
}
else
{
echo 'There should be no direct access to this naam_klant script!';
}
}
?>
I can't answer the question because it is incomplete. We need to see the content of the sql_naam_klant.php
to see why is it like that.
I am assuming that the error is in the query.
Use the Wildcard Symbol (%)
in your where statements.
"Select * from tblnames where name like '%$queryString%';"
Will edit this answer as soon as you provide us with complete details.
If you want to find what you typed inside,beginning or end of a text block use the wildcard in both start and end of the search keyword. %$queryString%
. If what you are looking for is the in beginning of a block of text then use $queryString%
and if you're looking at the end of a text blook %$queryString
.
You could use a .change() javascript event and do an async ajax post every time the input changes and update the suggestions div whenever the request is completed - that's how i would do it