JQuery-Ui自动完成不显示结果

问题描述 投票:0回答:1

我正在尝试显示管理员列表的自动完成结果。 我有以下代码:

的application.js

 function log(message) {
        $( "<div/>" ).text( message ).prependTo("#log");
    }

   $("#managers").autocomplete({
        source : function(request, response) {
            $.ajax({
                url : "/managerlist",
                dataType : "json",
                data : {
                    style : "full",
                    maxRows : 12,
                    term : request.term
                },
                success : function(data) {
                    var results = [];
                    $.each(data, function(i, item) {
                        var itemToAdd = {
                            value : item,
                            label : item
                        };
                        results.push(itemToAdd);
                    });
                    return response(results);
                }
            });
        }
    });

项目控制员

def manager_list 
  list=Project.all.map{|i|i.manager_user_id} 
  arr= [].concat(list.sort{|a,b| a[0]<=>b[0]}).to_json 
  render :json =>arr
end

的routes.rb

  match '/managerlist' => 'projects#manager_user_id'

_form.html.erb

<p>
        <%= f.label :manager_user_id %><br />
        <input id="managers" />
    </p>

以下代码没问题,我没有收到萤火虫的错误。 但是,当我尝试输入管理员名称,例如James Johnson时,名称将不会出现。 我也尝试将整个函数放在_form.html.erb中并将其包装在标签中,但这不起作用。 有没有想过为什么会这样

所以我设法修复了我的错误,这是因为Jquery核心和Jquery ui的排序。

我有经理被列入名单。 在下图中。

列出所有用户

从图像中可以看出,当我输入'Arm'时,它会显示整个经理列表,当它显示'Deshawn Armstrong'时。 我知道这很可能与我的项目控制器有关

项目控制员

def manager_list 
  list=Project.all.map{|i|i.manager_user_id} 
  arr= [].concat(list.sort{|a,b| a[0]<=>b[0]}).to_json 
  render :json =>arr
end
javascript ruby-on-rails-3 jquery-ui jquery-ui-autocomplete
1个回答
2
投票

检查Firebug控制台中的响应,并确保字符串采用适当的json格式进行自动完成。

看起来你刚刚返回一个数组。 .ajax中的dataType设置不会转换为json ; 它只是期待这种格式。 如果你没有从你的url : "/managerlist"发送json url : "/managerlist" ,这可能就是问题所在。

实际上,如果您的ajax功能正常工作,您可以:

return response(JSON.stringify({ results: results }));

的的jsfiddle示例JSON.stringifyhttp://jsfiddle.net/xKaqL/

根据您的新信息,您需要为自动填充添加minLength选项。

$("#managers").autocomplete({
    minLength: 2,   // 2 or whatever you want
   // rest of your code
© www.soinside.com 2019 - 2024. All rights reserved.