Мой автозаполненный плагин из jQuery не работает в первый раз с одним символом в текстовом поле.
Если я продолжаю набирать более одного символа, тогда автозаполнение запускается...
Поэтому я ожидаю результата от первого персонажа, но ничего не получаю.
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$( "#names" ).keyup(function() {
autocompleteNames();
});
});
function loadNames(){
//Gets the name
var nameSelected = $("#names").val();
var namesList = "";
$.ajax({
url: 'names.php',
type: "POST",
async: false,
data: { sport: nameSelected}
}).done(function(names){
namesList = names.split(',');
});
//Returns the javascript array of names.
return namesList;
}
function autocompleteNames(){
var names = loadNames();
$("#names").autocomplete({
source: names,
minLength: 1
});
}
</script>
</head>
<body>
Namn: <input type="text" id="names" name="names" />
</body>
</html>
И вот мой файл names.php, который очень прост
<?php
$sport = $_POST["sport"];
//Defines the name array.
$names[0] = "Sam";
$names[1] = "Anna";
$names[2] = "Jens";
$names[3] = "Johanna";
$names[4] = "Emma";
$names[5] = "Mikael";
$names[6] = "Mattias";
$names[7] = "Sebastian";
$names[8] = "Johan";
$names[9] = "Mona";
$names[10] = "Lina";
$names[11] = "Linda";
$names[12] = "Ebba";
$names[13] = "Andreas";
$names[14] = "Marcus";
$names[15] = "Markus";
$names[16] = "Anders";
$names[17] = "Maria";
$names[18] = "Sandra";
$names[19] = "Jonatan";
$names[20] = "Jacob";
$names[21] = "Carolina";
$names[22] = "Tom";
$names[23] = "Tim";
$names[24] = "Zlatan";
$names[25] = "Emelie";
//Defines an empty variable that will return the javascript array.
$teams = generateAutocompleteArray($names);
//Returns the teams in the appropriate javascript array format.
echo $teams;
//Function converts PHP array a string where it can be split into an array easily.
function generateAutocompleteArray($namesArray){
$jsNamesArray = "";
$teamCount = count($namesArray);
for($i=0; $i<$teamCount; $i++){
$jsNamesArray.= $namesArray[$i].',';
}
//Removes the remaining comma so you don't get a blank autocomplete option.
$jsNamesArray = substr($jsNamesArray, 0, -1);
return $jsNamesArray;
}
?>
Я не думаю, что вы должны привязать свой конструктор автозаполнения к событию keyup входного текста. Если это так, вы воссоздаете объект каждый раз, когда пользователь вводит что-то. Кроме того, вы возвращаете namesList и, возможно, он по-прежнему загружается из запроса ajax. Вам нужно дождаться завершения запроса, чтобы иметь имяList, помните, что javascript является асинхронным.
Таким образом, в принципе, вам нужно построить автокомплекс только один раз и искать параметры автозаполнения (источник), чтобы указать, что ваши данные загружаются через ajax. Взгляните на это: автозаполнение jQuery с обратным вызовом ajax json