取得对象并将其用作自动完成的来源

Question

I have need of an autocomplete using Jquery UI. The object I have looks like this.

"last_name":"A" , "first_name":"A" , "email_addr":"A@A.COM"

I have no control over this. It's how the data is formatted when it is returned from a database query. I want to use it as a source for the autocomplete. What I have is this:

    $( "#inputVisitorLastName" ).autocomplete({
source: visitorsDrop
});

where visitorsDrop is a list of those objects. What would be the best way to approach this and how would I go about doing that? Is there a way that I don't know of to change the objects to include the value and label tags that they need? Should I try to turn the objects into strings? Google turns up confusing results on how to do that, as well. I just tried something like this:

var intArr = [visitorsDrop.last_name];

and the array it makes is just undefined. I'm pretty new to Javascript and not sure what's going wrong; can anybody help me out?

EDIT: Since somebody asked, visitorsDrop is assigned its value through JSON and vb.net, which makes the database query; so it's made like this:

var visitorsDrop = that.getVisitors();

Answer 1

Need to turn an array of objects into an array of strings? Sounds like a job for map !

$( "#inputVisitorLastName" ).autocomplete({
    source: visitorsDrop.map(function(o) { return o.last_name; })
});

foo.map(...) builds a new array by passing each element of foo (an existing array) into a function and using the return value of each function call as the value for that place in the new array. So, here, each object in visitorsDrop is passed in as o to the function, and you get a new array filled with the last_name value of each object.

To support older browsers, you may need to supply a polyfill .