Rails：使用Ajax填充Jquery自动完成

I've been all over the place plugging different things into this process and I still get no results.

我一直在这个地方插入不同的东西进入这个过程,我仍然没有得到任何结果。

Sometimes I get the infamous extra "<" error, sometimes absolutely nothing happens, and I'm not sure if this is the problem but I think Google developer is showing that the current page is being sent as the json file I'm asking for and not the json I'm sending (see later). This is what I see in google developer: Which is definitly NOT my json file: In any case, this is my javascript:

有时我会得到臭名昭着的额外“<”错误,有时绝对没有任何反应,我不确定这是否是问题,但我认为Google开发人员显示当前页面是作为我要求的json文件发送的而不是我发送的json(见后文)。这是我在谷歌开发者看到的:这绝对不是我的json文件:无论如何,这是我的javascript:

$('#q_name_cont').autocomplete({
url: "autocomplete/items",
dataType: 'json'
});

This is my route:

这是我的路线:

get 'autocomplete/items' => 'home#autocomplete_items', :defaults=>{:format=>'json'}

Controller Action (commented out part is another method I was trying for a while):

控制器动作(注释掉部分是我尝试了一段时间的另一种方法):

def autocomplete_items
  # respond_to do |format|
  # format.js {render 'autocomplete_items'}
@products = Item.all.order(:name)
respond_to do |format|
  format.html
  format.json { 
    render json: @products.map {|item| item.name}
  }
end
end

Before I was using mapping, I was using this view for the render:

在我使用映射之前,我使用此视图进行渲染:

{
"items": [
<%Item.all.each do |i|%>
    { "<%=i.name%>","<%=i.name%>" },
<%#end%>
    { "value": "",        "data": "" }
]
}

I've really been all over the place, trying for a very long time to get this to work. What am I missing?

我真的到处都是,尝试了很长时间才能让它发挥作用。我错过了什么?

1 个解决方案

#1

IIRC, Your url and dataType options just do not exist in autocomplete's documentation. You could try source option instead:

IIRC,您的url和dataType选项在autocomplete的文档中不存在。您可以尝试使用源选项:

$('#q_name_cont').autocomplete({
  source: function (request, response) {
    $.ajax({
      url: "/autocomplete/items", // should be with '/'
      dataType: 'json',
      data: { query: request.term },
      success: function(data) {
        // call response to return the result to autocomplete box
        response(data);
      }
    });
  }
});

Of course, this is just for showing up all items, if you want to filter like real autocomplete box, you should modify controller to filter the result base on query:

当然,这只是为了显示所有项目,如果你想像真正的自动完成框一样过滤,你应该修改控制器来过滤基于查询的结果:

def autocomplete_items
  @products = Item.all.order(:name)
  respond_to do |format|
    format.html
    format.json { 
      render json: @products
                      .where('name ILIKE ?', "%#{params[:query]}%")
                      .pluck(:name)
    }
  end
end

#1