Witam serdecznie.
Posiadam dość dużą bazę danych (120 MB, 400 000 rekordów) i chciałbym dodać do mojego serwisu wyszukiwarkę z opcją podpowiedzi (jQuery, "autocomplete").
Generalnie mam już skrypt, który działa, podpowiedzi się wyświetlają, problem w tym, że całość z bazy jest pobierana od razu przy ładowaniu strony. Wszystko mogło by zostać, ale nie potrafię poradzić sobie z pobieraniem danych z bazy dopiero gdy ktoś zaczyna wyszukiwać (czyli np. kliknie na pole wyszukiwarki, bądź dotrze do niej klikając "Tab" z klawiatury.
Kod wygląda następująco:
<?php
mysql_connect("localhost", "root", "pass");
mysql_select_db("dbname");
$query=mysql_query("select hotelName from table");
while($dane=mysql_fetch_array($query))
{
$tablica1.='"'.$dane['hotelName'].'", ';
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<title>jQuery Autocomplete Plugin</title>
<script type="text/javascript" src="../lib/jquery.js"></script>
<script type='text/javascript' src='../lib/jquery.bgiframe.min.js'></script>
<script type='text/javascript' src='../lib/jquery.ajaxQueue.js'></script>
<script type='text/javascript' src='../lib/thickbox-compressed.js'></script>
<script type='text/javascript' src='../jquery.autocomplete.js'></script>
<script type='text/javascript' src='localdata.js'></script>
<link rel="stylesheet" type="text/css" href="main.css" />
<link rel="stylesheet" type="text/css" href="../jquery.autocomplete.css" />
<link rel="stylesheet" type="text/css" href="../lib/thickbox.css" />
<script type="text/javascript">
$().ready(function() {
$("#tags").autocomplete([<?php echo $tablica1; ?>], {
width: 320,
max: 10,
highlight: false,
multiple: true,
multipleSeparator: " ",
scroll: true,
scrollHeight: 300,
formatItem: function(row, i, max) {
return row[0] + " (<i>" + row[1] + "</i>)";
},
formatMatch: function(row, i, max) {
return row[0];
},
formatResult: function(row) {
return row[0];
},
});
});
</script>
</head>
<body>
<div id="content">
<p>
<input type="text" id='tags' />
<input type="button" value="Get Value" />
</p>
</div>
</body>
</html>
Jeszcze lepiej było by ładować dane, gdy ktoś wpisze np. 2 litery i nie zasysać całości, tylko te rekordy, które spełniają wymagania.
Z góry dziękuję za pomoc.
Pozdrawiam,
badyllek1993