blocks|key|412107|text|如果要返回一个复杂的json对象，则需要修改自动完成的成功函数，如下所示。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|412108|$.ajax({
++++url:+"/Employees/SearchEmployees",
++++dataType:+"json",
++++data:+{
++++++++searchText:+request.term
++++},
++++success:+function+(data)+{
++++++++response($.map(data.employees,+function+(item)+{
++++++++++++return+{
++++++++++++++++label:+item.name,
++++++++++++++++value:+item.id
++++++++++++};
++++++++}));
++++}
});|code-block|syntax|javascript|412109|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

If you are returning a complex json object you need to modify you success function of your auto-complete as follows. 

<pre><code>$.ajax({
 url: "/Employees/SearchEmployees",
 dataType: "json",
 data: {
 searchText: request.term
 },
 success: function (data) {
 response($.map(data.employees, function (item) {
 return {
 label: item.name,
 value: item.id
 };
 }));
 }
});
</code></pre>

blocks|key|627348|text|$(document).on('keyup','#search_product',function(){
++++$(+"#search_product"+).autocomplete({
++++++source:function(request,response){
++++++++++++++++++$.post("<?=+base_url('ecommerce/autocomplete')+?>",{'name':$(+"#search_product"+).val()}).done(function(data,+status){

++++++++++++++++++++response(JSON.parse(data));
++++++++});
++++++}
++++});
});|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|627349|PHP代码：|unstyled|627350|public+function+autocomplete(){
++++$name=$_POST['name'];
++++$result=$this->db->select('product_name,sku_code')->like('product_name',$name)->get('product_list')->result_array();
++++$names=array();
++++foreach($result+as+$row){
++++++++$names[]=$row['product_name'];
++++}
++++echo+json_encode($names);
}|627351|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|L|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$B|C]]|$1|I|3|-4|5|F|7|N|8|@]|9|@]|A|$]]]|J|$]]

<pre><code>$(document).on('keyup','#search_product',function(){
 $( "#search_product" ).autocomplete({
 source:function(request,response){
 $.post("&lt;?= base_url('ecommerce/autocomplete') ?&gt;",{'name':$( "#search_product" ).val()}).done(function(data, status){

 response(JSON.parse(data));
 });
 }
 });
});
</code></pre>

PHP code :

<pre><code>public function autocomplete(){
 $name=$_POST['name'];
 $result=$this-&gt;db-&gt;select('product_name,sku_code')-&gt;like('product_name',$name)-&gt;get('product_list')-&gt;result_array();
 $names=array();
 foreach($result as $row){
 $names[]=$row['product_name'];
 }
 echo json_encode($names);
}
</code></pre>

blocks|key|627375|text|我使用了$.each+(data+[i],+function+(key,+value)的结构，但是您必须预先匹配选择字段的名称和表单元素的名称。然后，在“成功”之后的循环中，自动完成"data“数组中的元素。做到这一点：autocomplete+form+with+ajax+success|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|627376|entityMap|0|LINK|mutability|MUTABLE|url|http://sysadmin-arh.ru/auto-complete-form-elements-with-ajax-query-results/^0|4|13|32|Z|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@$9|O|A|P|B|C]]|D|@$9|Q|A|R|1|S]]|E|$]]|$1|F|3|-4|5|6|7|T|8|@]|D|@]|E|$]]]|G|$H|$5|I|J|K|E|$L|M]]]]

I used the construction of <code>$.each (data [i], function (key, value)</code>
But you must pre-match the names of the selection fields with the names of the form elements. Then, in the loop after &quot;success&quot;, autocomplete elements from the &quot;data&quot; array. Did this: <a href="http://sysadmin-arh.ru/auto-complete-form-elements-with-ajax-query-results/" rel="nofollow noreferrer">autocomplete form with ajax success</a>

blocks|key|627408|text|我希望这能有所帮助：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|627409|var+token+=+document.getElementById('token').value;
var+nombre+=+document.getElementById('txtNombre').value;++++

$("#txtNombre").keyup(function+()+{
++++$.ajax({
++++++++type:+"POST",
++++++++url:+host()+%2B+"Formulario/BuscarNombreAutocompletar/",
++++++++data:+JSON.stringify({+"nombre":+nombre+}),
++++++++headers:+{
++++++++++++'Authorization':+'Bearer+'+%2B+token
++++++++},
++++++++contentType:+"application/json;+charset=utf-8",
++++++++dataType:+"json",
++++++++success:+function+(data)+{
++++++++++++var+dataArray+=+[];
++++++++++++if+(controlCarga(data))+{

++++++++++++++++$.each(data[1],+function+(i,+item)+{
++++++++++++++++++++dataArray.push(item.frmNombre)
++++++++++++++++});

++++++++++++++++$('#txtNombre').autocomplete({
++++++++++++++++++++clearButton:+true,
++++++++++++++++++++source:+dataArray,
++++++++++++++++++++selectFirst:+true,
++++++++++++++++++++minLength:+2
++++++++++++++++});
++++++++++++}
++++++++},
++++++++error:+function+(xhr,+textStatus,+errorThrown)+{
++++++++++++console.log('Error:+'+%2B+xhr.responseText);
++++++++}
++++});
});|code-block|syntax|javascript|627410|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

I hope this helps:
<pre><code>var token = document.getElementById('token').value;
var nombre = document.getElementById('txtNombre').value; 

$(&quot;#txtNombre&quot;).keyup(function () {
 $.ajax({
 type: &quot;POST&quot;,
 url: host() + &quot;Formulario/BuscarNombreAutocompletar/&quot;,
 data: JSON.stringify({ &quot;nombre&quot;: nombre }),
 headers: {
 'Authorization': 'Bearer ' + token
 },
 contentType: &quot;application/json; charset=utf-8&quot;,
 dataType: &quot;json&quot;,
 success: function (data) {
 var dataArray = [];
 if (controlCarga(data)) {

 $.each(data[1], function (i, item) {
 dataArray.push(item.frmNombre)
 });

 $('#txtNombre').autocomplete({
 clearButton: true,
 source: dataArray,
 selectFirst: true,
 minLength: 2
 });
 }
 },
 error: function (xhr, textStatus, errorThrown) {
 console.log('Error: ' + xhr.responseText);
 }
 });
});
</code></pre>

I'm trying to find a way to use jQuery autocomplete with callback source getting data via an ajax json object list from the server.

Could anybody give some directions?

I googled it but couldn't find a complete solution.

jQuery autocomplete with callback ajax json

服务器

jQuery

JSON

我正在尝试找到一种方法来使用带有回调源的jQuery自动完成，通过一个ajax json对象列表从服务器获取数据。有人能给我指路吗？我用谷歌搜索了一下，但找不到一个完整的解决方案。

问带有回调ajax json的jQuery自动完成
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问带有回调ajax json的jQuery自动完成EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问带有回调ajax json的jQuery自动完成
EN