我为用户提供了自动填充功能。
这是我的代码段:
$("input.autocomplete_user").autocomplete(
{
// Autocomplete Source: Category json
source: <%= raw User.select("distinct username as value, user_id as ID").where("username ILIKE ?", "%#{params[:term]}%").joins(:roles).all(conditions:{roles:{name: 'Creator'}}).to_json %>,
minLength: 0,
select: function (event, data) {
$(this).autocomplete('disable');
$("input.autocomplete_user_id").attr('value', data.item.id);
var opval = $("input.autocomplete_user_id").val();
}
})
我也希望展示用途的照片。就像这样:http://d.pr/i/mfJQ
你对此有什么想法吗?任何变通办法都将受到赞赏。
修改
实际上,我试过这个,但没有用。
$("input.autocomplete_user").autocomplete(
{
// Autocomplete Source: Category json
source: <%= raw User.select("distinct username as value, user_id as ID, photo_url as foto").where("username ILIKE ?", "%#{params[:term]}%").joins(:roles).all(conditions:{roles:{name: 'Creator'}}).to_json %>,
minLength: 0,
select: function (event, data) {
$(this).autocomplete('disable');
$("input.autocomplete_user_id").attr('value', data.item.id);
var opval = $("input.autocomplete_user_id").val();
}
})
.data("autocomplete")._renderItem = function(ul,item){
return $("<li></li>")
.data("item.autocomplete",item)
.append("<a>"+"<img src='" + item.foto +"'>" + item.first_name + " " + item.last_name + "<br>" + item.username + "</a>" )
.appendTo(ul);
};