Question

I am implementing the Jquery UI autocomplete. I have the following code.

Application.js

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

        $("#tags").autocomplete({
            source : function(request, response) {
                $.ajax({
                    url : "/projectlist",
                    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);
                    }
                });
            }
        });
    });

Project Controller

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

_form.html.erb

 <input id = "tags"/>

routes.rb

  match '/projectlist' => 'projects#project_list'

What my above code should do is, list projects. However I am getting the follwoing error in firebug.

$("#tags").autocomplete is not a function
[Break On This Error] source : function(request, response) { 

I have also tried following the example JQuery Ui Autocomplete and no luck and get the same error :S

Answer 1

I believe your problem is that you’re including the jquery & jquery-ui files in the BODY of your view (in the _form partial). You probably also loaded application.js in the HEAD (probably in your application layout) when you called javascript_include_tag :defaults. Instead, you should call jquery and the ui file before you call the defaults. Or, better yet, include them in the defaults as well by editing your application.rb file in the config folder.