Jquery自动完成返回结果,但结果没有显示任何内容

Jquery自动完成返回结果,但结果没有显示任何内容

问题描述:

我遇到了jQuery自动完成问题。我正在使用下面的函数,以获得inputACCO_KEY的结果。 问题是,我没有看到结果 - 但显然有东西从函数返回,因为我在div下面看到了自动完成表单 - 但始终是空的。有时它会更长,有时会更短(取决于返回的结果数量),但它总是空的。如果我从该空表中选择一些内容,则输入中显示的结果也是空的。Jquery自动完成返回结果,但结果没有显示任何内容

功能:

$("#inputACCO_KEY").autocomplete({ 
     source: function (request, response) { 
     $.ajax({ 
      method: 'post', 
      url: "/wsSearchCAMERC/GetCAACCOSearchAll/",   
      data: { 
      prefixText: $("#inputACCO_KEY").val(), 
      count: 30 
      }, 
      dataType: 'json', 
      success: function (data) { 
      response($(data).map(function (item, i) {    
       return {     
       label: item.First, 
       value: item.Second 
       }; 
      }) 
      ); 
      }, 
      error: function (data) { 
      alert('error'); 
      } 
     }); 
     }, 
     minLength: 3, 
     select: function (event, ui) {   
     log("Selected: " + ui.item.value + " aka " + ui.item.id); 
     } 
    }); 
    }); 

enter image description here

结果是类型:

["{"First":"BOŠTJA S.P.","Second":"160001670"}", 
"{"First":"GOLF KLUB","Second":"110001615"}", "{"First":"IRENA","Second":"150001322"}"] 

选择方法必须返回false。否则,它不会按预期工作。

全部工作例如:

$("#inputACCO_KEY").autocomplete({ 
     source: function (request, response) { 
     $.ajax({ 
      method: 'post', 
      url: "/wsSeCAMERC/GetCA/", 
      data: { 
      prefixText: $("#inputACCO_KEY").val(), 
      count: 30 
      }, 
      dataType: 'json', 
      success: function (data) { 
      response($.map(data, function (item, i) { 
       return { 
       label: item.cACCO_NME, 
       value: item.iACCO_KEY 
       }; 
      }) 
      ); 
      }, 
      error: function (data) { 
      alert('error!'); 
      } 
     }); 
     }, 
     minLength: 3, 
     select: function (event, ui) { 
     $("#inputACCO_KEY").val(ui.item.label); 
     $("#iACCO_KEY").val(ui.item.value); 
     return false; 
     } 
    }); 
    }); 

结果是类型:

[ “{” 第一 “:” BOŠTJA SP“,”Second“:”160001670“}”, “{” 第一 “:” GOLF KLUB “ ”第二“: ”110001615“}”, “{” 第一 “:” IRENA “ ”第二“: ”150001322“}”]

这听起来很奇怪。我假设内部的字符串分隔符被转义,所以你有一个字符串数组。 如果您遇到这种情况,你需要的地图功能更改为:

var data = ["{\"First\":\"BOŠTJA S.P.\",\"Second\":\"160001670\"}", "{\"First\":\"GOLF KLUB\",\"Second\":\"110001615\"}", "{\"First\":\"IRENA\",\"Second\":\"150001322\"}"]; 
 
var result = $(data).map(function (idx, ele) { 
 
    var item = JSON.parse(ele); 
 
    return { 
 
     label: item.First, 
 
     value: item.Second 
 
    }; 
 
}); 
 

 
console.log(result); 
 

 
$("#tags").autocomplete({ 
 
    source: function (request, response) { 
 
     var data = ["{\"First\":\"BOŠTJA S.P.\",\"Second\":\"160001670\"}", "{\"First\":\"GOLF KLUB\",\"Second\":\"110001615\"}", "{\"First\":\"IRENA\",\"Second\":\"150001322\"}"]; 
 
     response($(data).map(function (idx, ele) { 
 
      var item = JSON.parse(ele); 
 
      return { 
 
       label: item.First, 
 
       value: item.Second 
 
      }; 
 
     })); 
 
    } 
 
});
<link href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script> 
 

 

 
<div class="ui-widget"> 
 
    <label for="tags">Tags: </label> 
 
    <input id="tags"> 
 
</div>