Witam męczę się od dłuższego czasu z auto uzupełnieniem pola szukaj. Wszystko działa ok jeżeli podpowiedzi znajdują się w tym samym pliku co kod, jeśli zastosuje ścieżkę do pliku to po wpisaniu dowolnego znaku w input szukaj wyświetla wszystkie podpowiedzi.
plik z podpowiedziami:
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);}
mysqli_set_charset($conn,"utf8");
?>
<ul id="country-list">
<?php
$sql = "SELECT DISTINCT `tag` FROM `rewievs` WHERE `ver` = '1' AND `tag` != '' ORDER BY `id` DESC LIMIT 100";
$result = $conn->query($sql);
while($row = $result->fetch_assoc()){
?>
<li onClick="selectCountry('
<?php echo $row['tag']; ?>');">
<?php echo $row['tag']; ?></li>
<?php } ?>
</ul>
plik index
<html>
<head>
<TITLE>jQuery AJAX Autocomplete - Country Example</TITLE>
<head>
<style>
body{width:610px;}
.frmSearch {border: 1px solid #a8d4b1;background-color: #c6f7d0;margin: 2px 0px;padding:40px;border-radius:4px;}
#country-list{float:left;list-style:none;margin-top:-3px;padding:0;width:190px;position: absolute;}
#country-list li{padding: 10px; background: #f0f0f0; border-bottom: #bbb9b9 1px solid;}
#country-list li:hover{background:#ece3d2;cursor: pointer;}
#search-box{padding: 10px;border: #a8d4b1 1px solid;border-radius:4px;}
</style>
<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$("#search-box").keyup(function(){
$.ajax({
type: "POST",
url: "readCountry.php",
data:'keyword='+$(this).val(),
beforeSend: function(){
$("#search-box").css("background","#FFF url(LoaderIcon.gif) no-repeat 165px");
},
success: function(data){
$("#suggesstion-box").show();
$("#suggesstion-box").html(data);
$("#search-box").css("background","#FFF");
}
});
});
});
function selectCountry(val) {
$("#search-box").val(val);
$("#suggesstion-box").hide();
}
</script>
</head>
<body>
<div class="frmSearch">
<input type="text" id="search-box" placeholder="Country Name" />
<div id="suggesstion-box"></div>
</div>
</body>
</html>
Stosowałem różne rozwiązania, w tym z oficjalnej strony jquery i zawsze jest to samo..
DEMO
http://phppot.com/demo/jquery-ajax-autocom...ountry-example/działa prawidłowo, nie mogę sprawdzić zawartości pliku z podpowiedziami: readCountry.php, a u mnie można. Może to jest przyczyną?
Ten post edytował tenloginjestzajety 12.07.2017, 22:10:38
Nigdy nie zapominam kliknąć "pomógł". Zastosowanie na stronie [prosze nie spamuj]