JqueryUI Autocomplete : only one character is displayed per list item

问题

I'm using jquery-1.4.2.min and jquery-ui-1.8.6.custom to get the autocomplete data on a jsp page, here is the code snippet:

$(document).ready(function() { $("input#airportfrom").autocomplete({minLength: 3,
source: function(request, response) { $.ajax({ 
url: "MLocationLookupSearchPopUpAuto.action?LANGUAGE=${param.LANGUAGE}&SITE=${param.SITE}&RESULT_FILTER=3",
dataType:"text/html", 
data: { MATCH : $("#airportfrom").val() }, 
success: function(data) { response(data); } }); } }); });

The result returned is correct as I have used an alert(data); inside the success function and it gave correct result, but in the list, it is showing one character or one alphabet per line, hence if I want to get LONDON, it is displayed as:

l
o
n
d
o
n

Any idea why this happening ? Whether we have to give data as json only because here I'm getting the data from a jsp.

回答1:

Try to split the response data into lines using "\n"

$("#tags").autocomplete({
                source: function(request,response) {
                    $.ajax({
                    dataType: "text",
                    url: 'yourscript.php?extraParam=foo',
                    data: { term: request.term },
                    success: function(data) {
                         var lines = data.split("\n");
                         response(lines);
                    }
                })}
        });

回答2:

I had the same problem and it was down to serializing the object twice (by mistake) on the server side. The JSON data returned to the client was being de-serialized to a string rather than an array.

来源：https://stackoverflow.com/questions/4525279/jqueryui-autocomplete-only-one-character-is-displayed-per-list-item