2017-04-10 164 views
0

我遇到了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"}"] 

回答

0

選擇方法必須返回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; 
     } 
    }); 
    }); 
1

結果是類型:

[ 「{」 第一 「:」 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>

相關問題