Использование автозаполнения jQuery с AJAX & JSON

Я пытаюсь использовать виджет автозаполнения jQuery UI, но безуспешно. Нет списка представленных матчей.Использование автозаполнения jQuery с AJAX & JSON

Мой сценарий выглядит следующим образом:

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css"> 
<script src="./jquery-1.11/jquery-1.11.1.min.js"></script> 
<script src="./jquery-ui-1.11.1/jquery-ui.min.js"></script> 
<script> 
$("#tags").autocomplete({ 
    source: function(request, response) { 
    $.ajax({ 
     url: "testAJAX.php", 
     type: "POST", 
     dataType: "json", 
     data: {term: request.term}, 
     success: function(data) { 
     response(data); 
     } 
    }); 
    } 
}); 
</script> 
</head> 
<body> 
<input type="text" id ="tags" /> 
</body> 
</html>

На сервере мой PHP код выглядит следующим образом:

<?php include "dbConnect.php"; 
header('Content-type: application/json'); 

$q=$_POST["term"]; 

$sql="SELECT name, id as value, id FROM sample WHERE id LIKE '".strtoupper($q)."%';"; 

$result = mysqli_query($con, $sql); 

$rows = array(); 
while($r = mysqli_fetch_array($result)) { 
    $rows[] = $r; 
} 

$json = json_encode($rows); 
echo $json;

Я проверил, что AJAX и JSON работает с помощью следующей JQuery скрипт который выводит значения из php.

<script> 
    $(document).ready(function(){ 
    $('#path').keyup(function(){ 
     var t = $('#path').val(); 
     $.ajax({ 
     type: "POST", 
     url: "testAJAX.php", 
     data: {term: t}, 
     dataType: 'json', 
     success: function(data) { 
      $('#tags').html(''); 
      for (var i in data) { 
      $('#tags').append(data[i].value + '<br/>'); 
      } 
     } 
     }); 
    }); 
    }); 
</script> 
</head> 
<body> 
<input type="text" id="path" /> 
<div id="tags"> 
</div> 
</body> 
</html>

источник

2014-10-22 user3612964

Я разработал его; Я не поставил автозаполнение в блок $ (function() {}).

Так оно и должно быть:

$(function(){ 
    $("#tags").autocomplete({ 
    source: function(request, response) { 
     $.ajax({ 
     url: "testAJAX.php", 
     type: "POST", 
     dataType: "json", 
     data: {term: request.term}, 
     success: function(data) { 
      response(data); 
     } 
     }); 
    } 
    }); 
});

источник

2014-10-23 08:30:08 user3612964

Jquery автозаполнения (Получить метод, Linq, Json) работает 100%

Javascript

$(function() { 
    $("#SearchFirst").autocomplete({ 
     source: function (request, response) { 
      $.ajax({ 
       url: "/Admin/GetItemList", 
       dataType: "json", 
       data: { term: request.term }, 
       success: function (data) { 

        response(data); 
       } 
      }); 
     } 
    }); 
});

public ActionResult GetItemList() 
{ 
    var search = Request.Params["term"]; 

    var itemList = (from items in db.TblItems where items.ItemName.StartsWith(search) select new { label = items.ItemName, value = items.ItemName }).ToList(); 

    return Json(itemList, JsonRequestBehavior.AllowGet); 
}

источник

2016-05-18 12:40:41

Использование автозаполнения jQuery с AJAX & JSON

ответ

Смежные вопросы